Chcesz mieć ramkę inną niż możliwe do zrobienia w CSS? Ze ściętymi narożnikami, a może ramkę podwójną i kropkowaną? Czy jeszcze coś innego? Ten post jest dla ciebie.
Możesz narysować sobie tło, ale wtedy należałoby uważać z rozmiarem elementu, który ma to tło. Jak się zbytnio powiększy nasze tło nieładnie się rozciągnie.
Zatem może by zrobić jeden obrazek jako środek, który by się dowolnie powielał i dwa inne, które zajęłyby końce? I na to właśnie mam kod.
Jeśli element jest pionowy robimy to tak:
selektor {background: url("góra") no-repeat top center, url("dół") no-repeat bottom center, url("środek") repeat-y center center;}
W przypadku poziomego elementu wygląda to tak:
selektor {background: url("lewy") no-repeat center left, url("prawy") no-repeat center right, url("środek") repeat-x center center;}
W miejsce słowa selektor wpisujemy nazwę tego, czemu chcemy podarować tło. Tu może być #Blog1, .header-inner albo blockquote. Po prostu cokolwiek.
W miejsce wyróżnień wstawiamy linki do naszych obrazków z elementami tła. To może wyglądać np. tak:
A zrobiłam to z takich obrazków:
i na dole:
oraz pośrodku:
Bardzo, ale to bardzo przydatna instrukcja i na pewno z niej niebawem skorzystam.
OdpowiedzUsuńCzasami instrukcja jest , ale jest wytłumaczona nijak , nie do zrozumienia, ale za to tę bardzo dobrze zrozumiałam.
Pozdrawiam :D
Dziękuję za pochwałę :)
UsuńNaprawdę przydatna instrukcja - na pewno skorzystam.:>
OdpowiedzUsuń