Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [HTML][CSS] 3 kolumnowy uklad strony z logiem
-silesian-
post
Post #1





Goście
Witam,
dopiero zaczynam uczyc sie robic strony i juz napotkalem problem.
Z tego co wyczytalem(m. innymi na tym forum) jak robic taki uklad to nalezy zrobic jeden duzy div, ktory chce by byl jednej ustalonej szerokosci i dlugosci i byl zawsze byl wypozycjonowany na samym srodku strony niezaleznie od tego czy ktos oglada ta strone na monitorze 17 calowym czy 24 calowym. W tym duzym divie chcialbym umiescic 4 mniejsze, jeden u gory i caly ten div zajmowaloby zdjecie bedace logiem. Pozostale 3 divy bylyby kolumnami, dwa divy tej samej wielkosci po bokach,w ktorych bylby tekst, i jeden duz wiekszy pomiedzy nimi i w nim bylyby zdjecia badz tekst. Pod tymi divami chcialbym umiescic jeszcze jeden ze stopka.
Czy ktos moglby mi podac jakas wskazowe jak to zrobic?
Bo jak sam probowalem to robilem jeden duzy div, a w nim jeszcze jeden nadawalem mu taka sama szerokosc jak duzemu divowi i wstawialem zdjecie,takie sajmej szerokosci, a wszystko i tak nie wygladalo tak jak chcialem, nie mowiac juz o tym, ze nie udalo mi sie nawet dobrze ustawic tego duzego diva by byl po srodku.
Go to the top of the page
+Quote Post
JoShiMa
post
Post #2





Grupa: Zarejestrowani
Postów: 1 374
Pomógł: 149
Dołączył: 1.03.2006

Ostrzeżenie: (0%)
-----

Polecam na początek lekturę obowiązkową.


--------------------
Zajrzyj, poczytaj, naucz się
Go to the top of the page
+Quote Post
neverever
post
Post #3





Grupa: Zarejestrowani
Postów: 278
Pomógł: 44
Dołączył: 17.02.2004
Skąd: Wieliczka

Ostrzeżenie: (10%)
X----

Gotowce znajdzies tu: http://www.google.com/search?hl=pl&cli...=Szukaj&lr= -zobacz jak są zrobione.

Całość rozbija się o odpowiednie wymiarowanie i wyrównanie floatem.


--------------------
neverever
Go to the top of the page
+Quote Post
-silesian-
post
Post #4





Goście
Dobra dzieki stronie, ktora joshima pdales, zrobilem 3 kolumnowy uklad strony.
2 bocznych kolumnach dalem jakis tam background-color lecz chce by ten kolor zajmowala cala kolumne od loga do stopki, a nie tylko ten obszar, w ktorym jest tekst w tej kolumnie. Jak to zrobic?
Oraz mam jeszcze taki problem, ze w divie po srodku, w ktorym ma byc jakas tam tresc strony, umiescilem zdjecie, lecz gdy chce dodac background-color do tego diva wyskakuje obok obrazka tylko mala cienka kreska z tym kolorem, jak zrobic by caly ten div mial tlo koloru takiego jaki okresle w css?
Go to the top of the page
+Quote Post
JoShiMa
post
Post #5





Grupa: Zarejestrowani
Postów: 1 374
Pomógł: 149
Dołączył: 1.03.2006

Ostrzeżenie: (0%)
-----

Cytat(silesian @ 31.07.2008, 10:50:50 ) *
Dobra dzieki stronie, ktora joshima pdales

Podałaś exclamation.gif!


Cytat(silesian @ 31.07.2008, 10:50:50 ) *
2 bocznych kolumnach dalem jakis tam background-color lecz chce by ten kolor zajmowala cala kolumne od loga do stopki, a nie tylko ten obszar, w ktorym jest tekst w tej kolumnie. Jak to zrobic?

Aaaa. To już wyższaśzkoła jazdy:
http://perfectionorvanity.com/2007/03/07/r...ny-layoutu-css/
http://perfectionorvanity.com/2006/08/08/b...a-kolumn-w-css/


Cytat(silesian @ 31.07.2008, 10:50:50 ) *
Oraz mam jeszcze taki problem, ze w divie po srodku, w ktorym ma byc jakas tam tresc strony, umiescilem zdjecie, lecz gdy chce dodac background-color do tego diva wyskakuje obok obrazka tylko mala cienka kreska z tym kolorem, jak zrobic by caly ten div mial tlo koloru takiego jaki okresle w css?

Musiałes się machnąć. Pokaz kod.

Ten post edytował JoShiMa 31.07.2008, 09:57:36


--------------------
Zajrzyj, poczytaj, naucz się
Go to the top of the page
+Quote Post
-silesian-
post
Post #6





Goście
Z tymi kolumnami to se dam spokoj, bo nie dam rady tego zrobic;]
Natomiast mam inny problem chcialbym dac jakis background image w divie tresc ale no nie wyswietla mi go jak wpisze background-image: url(tutajadresobrazka);
Tutaj kod:
[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4.   <title></title>
  5.   <style type="text/css">
  6.   html, body {
  7. 	background-color: #fff;
  8. 	color: #000;
  9. 	margin: 0;
  10. 	padding: 0;
  11. }
  12. #top {
  13. 	width: 920px;
  14. }
  15.  
  16. #NAGLOWEK {
  17. 	background-color: #888;
  18. }
  19.  
  20. #MENU {
  21. 	width: 150px;
  22. 	float: left;
  23. 	overflow: hidden;
  24. 	background-color: #ccc;
  25. }
  26.  
  27. #INFORMACJE {
  28. 	width: 150px;
  29. 	float: right;
  30. 	overflow: hidden;
  31. 	background-color: #ccc;
  32. }
  33.  
  34. #TRESC {
  35. 	width: 480px;
  36. 	float: left;
  37. 	overflow: hidden;
  38. 	background-image:url("obrazek.jpg");
  39. 	}
  40. #STOPKA {
  41. 	clear: both;
  42. 	width: 100%;
  43. 	background-color: #888;
  44. }
  45.  
  46.  
  47.   </style>
  48.   <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
  49. </head>
  50. <body>
  51. <div id="top">
  52. 	<div id="NAGLOWEK"><img src="panorama.jpg" /> </div>
  53. 	<div id="MENU">
  54. menu nawigacyjne
  55. 	</div>
  56. 	<div id="INFORMACJE">
  57. Dodatkowe informacje	
  58. 	</div>
  59. 	<div id="TRESC"></div>
  60. 	<div id="STOPKA">Stopka serwisu</div>
  61. </div>
  62. </body>
  63. </html>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
Pilsener
post
Post #7





Grupa: Zarejestrowani
Postów: 1 590
Pomógł: 185
Dołączył: 19.04.2006
Skąd: Gdańsk

Ostrzeżenie: (0%)
-----

Div TOP jest zbędny - po to jest html+body. Zamiast diva nagłówek lepiej dać <h1>, a <img src="panorama.jpg" /> wywalić do CSS - stałe elementy laya powinny być w CSS, img służy do wstawiania obrazków do treści. Jak chcesz układ 3-kolumnowy to na moim blogu masz taki - musisz tylko nadać body stałą szerokość jeśli nie chcesz, aby strona się dostosowywała do rozdzielczości.

Cytat
nie wyswietla mi go jak wpisze background-image:
- a jak dasz background-color to też nic nie ma? Jakie wymiary ma div TRESC? Widać dokładnie tyle tła, ile x na y ma obiekt, w którym się znajduje. Jeśli obiekt jest większy do tła to tło zacznie się powtarzać (lub nie, bo to też możemy ustawić, podobnie jak pozycję tła).
Go to the top of the page
+Quote Post
JoShiMa
post
Post #8





Grupa: Zarejestrowani
Postów: 1 374
Pomógł: 149
Dołączył: 1.03.2006

Ostrzeżenie: (0%)
-----

A ten obrazek co ma być tłem jest w tym samym katalogu co css?


--------------------
Zajrzyj, poczytaj, naucz się
Go to the top of the page
+Quote Post
-silesian-
post
Post #9





Goście
Tak jest na sto procent w tym samym katalogu.
Pilsener moglbys podac link?
Go to the top of the page
+Quote Post
-silesian-
post
Post #10





Goście
Po dodaniu do divu tresc background-color: black; nie zapelnia sie caly div kolorem czany, tylko niewielka linia.
Moze to przez to nie moge dodac obrazka jako background-image?
Tak to wyglada:
Go to the top of the page
+Quote Post
-silesian-
post
Post #11





Goście
Sorry za double posta ale jako gosc nie moge edytowac. Oczywiscie to wszystko co jest biale miedzy kolumnami to powinien byc div tresc.
Go to the top of the page
+Quote Post
-silesian-
post
Post #12





Goście
Naprawde nikt nie wie dlaczego nie moge tego obrazka wstawic?
Go to the top of the page
+Quote Post
JoShiMa
post
Post #13





Grupa: Zarejestrowani
Postów: 1 374
Pomógł: 149
Dołączył: 1.03.2006

Ostrzeżenie: (0%)
-----

Na tej miniaturce naprawdę nie widać o co Ci chodzi.


--------------------
Zajrzyj, poczytaj, naucz się
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 19.08.2025 - 04:30
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn