Hr-tagi
Tag hr asettaa erottavan vaakasuoran
viivan. Tagin etuna on, että yhden viivan
vetämiseen ei tarvita
luoda ylimääräisiä lohkoja. Ei vaadi sulkevaa
tagia.
Esimerkki
Katsotaan kuinka tagi hr toimii:
<hr>
:
Esimerkki
Yritetään vaihtaa viivan väriä käyttämällä
CSS-ominaisuutta border-color:
<hr style="border-color: red;">
:
Esimerkki
Viivan väriä voidaan vaihtaa myös ominaisuudella
color
(samaan aikaan, jos ominaisuudet
color ja border-color
on asetettu - jälkimmäisellä on etusija):
<hr style="color: red">
:
Esimerkki
Vaihdetaan nyt viivan väri käyttämällä
CSS-ominaisuutta border.
Huomaa, että tällöin viiva
tulee kaksinkertaisen paksuiseksi (koska asetimme
reunan sekä ylä- että alapuolelle):
<hr style="border: 1px solid red;">
:
Esimerkki
Yritetään vaihtaa viivan väriä käyttämällä CSS-
ominaisuutta border-top,
ja asetetaan vain yläreuna. Nyt
kaksoisviivaa ei tule:
<hr style="border-top: 1px solid red;">
:
Esimerkki
Tehdään viiva pistemäiseksi käyttämällä
CSS-ominaisuutta border-top,
aseta arvo dotted arvon solid sijaan:
<hr style="border-top: 1px dotted red;">
:
Esimerkki
Suurennetaan viivan paksuutta käyttämällä
CSS-ominaisuutta border-width:
<hr style="border-width: 10px; border-color: red;">
:
Esimerkki
Ja nyt lisätään viivalle korkeus height
ja reuna käyttäen border.
Reuna jakautuu tällöin ylä- ja alaosaan:
<hr style="height: 10px; border: 1px solid red;">
:
Katso myös
-
tagi
br,
joka asettaa rivinvaihdon
