Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS]tło gradient do pewnego momentu
Forum PHP.pl > Forum > Przedszkole
robos85
Otóż mam taki problem. Jako tło strony chcę zrobić cieniowane paski w pionie. Do pewnego momentu mają się cieniować a po tym mają już się powtarzać w tym samym kolorze.

Jak takie coś mogę uzyskać?
ayeo
Kod
body
{
  background: #000 url( pasek.png ) repeat-x;
}


Mniej więcej tak smile.gif

Pozdrawiam!
robos85
Prawie, bo koniec to też ma być jako obrazek a nie stały kolor:/
wookieb
Fajnie by było gdybyś zapodał taki obrazek tego co chcesz uzyskać.
ayeo
Źle Cię zrozumiałem. Jeżeli w pionie to większy kłopot. Najlepiej wytnij (1px wysokości) tło strony razem z paskami daj to do kontenera, a kontenerowi daj padding na szerokość pasków.

Pozdrawiam!
robos85


Mniej więcej takie coś, i od pewnego momentu w pionie będzie już stały kolor ale nadale ten wzorek pasków...
wookieb
W body ustawiasz tło (obrazek z paskami w jednolitym kolorze) powtarzalne na całym obszarze (repeat)
w to wstawiasz diva z tłem na wysokosc gradientu z repeatem w poziomie (repeat-y). Na początku może nie widać efektów wieć wstaw wysoką treść w div-a
robos85
a ten div ma mieć jakiś niski z-index lub coś? Bo jak nałożę na niego kolejne divy to chyba go zakryją?
Ew. czy dać mu pozycję absolutną?
ayeo
Pokombinuj, tak trudno sprawdzić?
wookieb
0 pozycjonowania absolutnego ani zadnych innych z-indexow.
Pewnie ze przykryja ale tylko wtedy jezeli dasz im jakis kolor. Jednak jak domniemam podane tło ktore chcesz uzyskać ma być ogólnym tlem strony. Wiec w srodku tego diva wstawiasz reszte kodu odpowiedzialnego za layout.
Jeżeli cie nei rozumiem to bij tongue.gif
wr0b3l
Możesz też jeszcze dodać:
background-attachment: fixed;
Wtedy tło nie będzie się przemieszczać przy przesuwaniu strony. Do tego dodaj jeszcze repeat-x, czy repeat-y.
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.