HTML <hr> -elementti

Määritelmä ja käyttö

<hr> Avainsanat määrittelevät HTML-sivun sisällön erottelun (esim. aiheen muutoksen).

<hr> Elementit näytetään yleensä horisontaalisina viivoina, joita käytetään sisällön erottamiseen HTML-sivulla tai sisällön muutosten määrittämiseen.

Katso myös:

HTML DOM -viittauskirja:HR-objekti

esimerkki

esimerkki 1

käyttää <hr> Avainsanat määrittelevät sisällön aiheenvaihdoksen:

<h1>Webin pääkielet</h1>
<p>HTML on Web-sivujen luomisen standardimarkkinoima kieli. HTML kuvaa Web-sivun rakennetta, joka koostuu sarjasta elementtejä......</p>
<hr>
<p>CSS on kieli, joka kuvaa HTML-elementtien näyttämistapaa näytöllä, paperilla tai muilla medioilla......</p>
<hr>
<p>JavaScript on HTML:n ja Webin ohjelmointikieli. JavaScript voi muuttaa HTML-sisältöä ja -ominaisuuksia......</p>

Kokeile itse

esimerkki 2

tasoitettu <hr> elementti(käyttämällä CSS):

<hr style="width:50%;text-align:left;margin-left:0">

Kokeile itse

esimerkki 3

varjoitta <hr> (käyttämällä CSS):

<hr style="height:2px;border-width:0;color:gray;background-color:gray">

Kokeile itse

Esimerkki 4

Aseta <hr> Elementin korkeus (CSS:n avulla):

<hr style="height:30px">

Kokeile itse

Esimerkki 5

Aseta <hr> Elementin leveys (CSS:n avulla):

<hr style="width:50%">

Kokeile itse

Globaalit ominaisuudet

<hr> Tagi tukee myös HTML:ssä olevat globaalit ominaisuudet.

tapahtumamäärittelyominaisuuksia

<hr> Tagi tukee myös HTML:ssä tapahtumamäärittelyominaisuudet.

Oletusarvoiset CSS-asetukset

Useimmat selaimet näyttävät seuraavat oletusarvot <hr> Elementti:

hr {
  display: block;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: auto;
  margin-right: auto;
  border-style: inset;
  border-width: 1px;
}

Kokeile itse

Selaimen tuki

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Tuki Tuki Tuki Tuki Tuki