A hr tag
A hr tag vízszintes elválasztó vonalat határoz meg.
A tag előnye, hogy egyetlen vonal létrehozásához
nem szükséges extra blokkokat létrehozni. Nem igényel záró taget.
Példa
Nézzük meg, hogyan működik a hr tag:
<hr>
:
Példa
Próbáljuk meg megváltoztatni a vonal színét a
CSS border-color
tulajdonságával:
<hr style="border-color: red;">
:
Példa
A vonal színe megváltoztatható a
color
tulajdonsággal is
(ebben az esetben, ha egyszerre van megadva a
color és a border-color
tulajdonság - a másodiknak van prioritása):
<hr style="color: red">
:
Példa
Most változtassuk meg a vonal színét a
CSS border
tulajdonságával.
Figyeljük meg, hogy ekkor a vonal dupla vastagságúvá válik
(mivel felső és alsó szegélyt is határoztunk meg):
<hr style="border: 1px solid red;">
:
Példa
Próbáljuk meg megváltoztatni a vonal színét a CSS
border-top
tulajdonságával,
és csak a felső szegélyt határozzuk meg. Most már nem lesz dupla vonal:
<hr style="border-top: 1px solid red;">
:
Példa
Készítsük el a vonalat pontok formájában a
CSS border-top
tulajdonságával,
adjuk meg a dotted értéket a solid helyett:
<hr style="border-top: 1px dotted red;">
:
Példa
Növeljük meg a vonal vastagságát a
CSS border-width
tulajdonságával:
<hr style="border-width: 10px; border-color: red;">
:
Példa
Most adjunk a vonalhoz magasságot height
és szegélyt a border
segítségével.
Ebben az esetben a szegély felső és alsó részre bomlik:
<hr style="height: 10px; border: 1px solid red;">
:
Lásd még
-
a
brtag,
ami sortörést határoz meg
