Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS]Jak zakodować otoczkę strony
Forum PHP.pl > Forum > Przedszkole
robos85
Chcę zrobić stornkę opartą o div'y. Tylko nie wiem jak zrobić, że wokół głównego diva jest jakby szara otoczka - będzie to jakiś gradient. jak to teraz zakodować, żeby storna miała dynamiczna wysokość, a ten szary motyw była zawsze dookoła strony?
golaod
Jeżeli div jest 100% na 100% to wystarczy w stylu dać borde:1px solid kolor gdzie 1px sam sobie dobierz jaką chcesz grubość a kolor ofc też ty zamieniasz na swoją wartość
ferrero2
Mamy diva container którego umieszczasz w <body> dla body dajesz:

Kod
body,html
{
margin:0px;
border:0px;
padding:0px;
width:100%;
height:100%;
}


a dla container-a :

Kod
container
{
margin:0px;
border:1% solid #9A9D98;
padding:0px;
width:98%;
height:98%;
}


Jeśli chcesz robić stronę zmieniającą się dynamicznie to najlepiej dopasować obramowanie po 1 % na lewo i na prawo i na dół i na górę.
Kwestia wypozycjonowania głównego kontenera.

Mam nadzieję że o to chodziło.

Pozdrawiam

border: 2px solid
robos85
ramka będzie jakimś obrazkiem - mały gradient to będzie. I własnie nie wiem jak do tego podejść żeby go umieścić dobrze:)
ferrero2
Ustawiasz dla body:

Kod
body,html {
margin: 0 auto;
border:0;
padding: 0 auto;
width:100%;
text-align: center;
background: URL(zdjecie_otoczka.jpg);


a dla kontenera ustawiasz wszystko na 90% i tutaj budujesz juz sobie swoje elementy.
I jeśli np robisz stronę dostosowaną do 1024/768 to ten obrazek musi być troche większy.

Natomiast przy dynamicznie zmieniającej się stronie to dochodzi jeszcze skalowanie obrazka bo moim zdaniem jedynym rozwiązaniem to jest repeat-x dla tła ale wtedy potrzebujesz 1px obrazek i "tak jakby" z niego stworzyć obrazek.

Ja osobiście niewiem jak zrobić taki efekt jak jest na www.filmweb.pl (tam np w tej chwili jest podstawowa strona natomiast kiedy do kina wchodzi np transformers to cała strona jest umieszczana wewnątrz dłoni transformersa)
Nie rozpoczynając nowego wątku może jacyś spece wiedzą jak coś takiego osiągnąć questionmark.gif Bo wątpie żeby to było robione na zasadzie obrazka dużo większego od minimalnej rozdzielczości przeglądarki do której jest dostosowywana strona ?

Pozdrawiam
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.