Pozioma linia
Bardzo cz?sto, gdy chcemy wydzieli? cz???? strony, oddzieli? rzeczy wa??ne od mniej wa??nych u??ywamy poziomej linii czyli:
-
<hr />
Do wykonania linii wykorzystamy element p??ywaj?cy czyli warstw? oraz wykonany np. w??asnor?cznie obrazek:
-
.hr {
-
width: 100%;
-
background: url(moja_kreska.gif) 50% 50% no-repeat;
-
height: 3px;
-
font-size: 0;
-
}
No i po kolei. Szeroko??? kreski 100%, t??o kreski/warstwy w po??o??eniu center/center czyli wy??rodkowane w pionie i poziomie, wysoko??? "kreski" 3 piksele, wysoko??? czcionki… 0px. Tutaj pojawia si? pytanie po co ta czcionka i co to za wysoko???? Ano IE zak??ada, ??e co?? w tej warstwie napiszemy wi?c zostawia w warstwie miejsce na czcionk?. Bez ustalenia wysoko??ci fonta na 0, nie by??oby mo??liwym uzyskanie wy??wietlenia w IE warstwy o wysoko??ci chocia??by 1 piksela.
Aby wstawi? wykonan? przed chwil? kresk? wystarczy w odpowiednim miejscu wpisa?:
-
<div class="hr" />
Przyk??ad dzia??ania/wygl?d mo??esz zobaczy? powy??ej - pod tytu??em ka??dego z artyku????w. W przygotowanej w w/w spos??b warstwie mo??na wstawi? jak?kolwiek grafik? (chocia??by ??adny ornament), nada? kolor t??a lub wstawi? "transparent" itd …
* * *
-
Napisał: ldiotka — 25/09/2010 @ 20:05
Divy si? zamyka, a URL'ki daje w cudzys??owy.
-
Napisał: Stal — 23/04/2011 @ 18:04
Dzi?ki w??a??nie czego?? takiego szuka??em. Pozdrawiam.
