Horisontaalisten rivien lisääminen sivun sisällön hajottamiseen

Kuinka käyttää HR-tunnistetta verkkoasiakirjaan

HR-tunnistetta on perinteisesti käytetty horisontaalisen viivan (jota kutsutaan joskus horisontaaliseksi säännönä) lisäämiseksi verkkoasiakirjaan. Jos haluat lisätä rivin, kirjoitat:


ohjeet selaimelle piirtää viiva koko sivun tai vanhemman elementin koko leveydelle oletusasetusten avulla. Tämä oletuslinja on yksinkertainen ja palvelee usein sen tarkoitusta, mutta attribuutteja voidaan määrittää muuttamaan rivin koko, väri ja sijainti muiden ominaisuuksien mukaan. Mekaanisen viivan ulkoasun muokkausmenetelmä muuttui HTML4: n ja HTML5: n välillä .

Onko HR-tunniste semanttinen?

HTML4: ssä HR-tunniste ei ollut semanttinen. Semanttiset elementit kuvaavat niiden merkitystä selaimessa ja kehittäjä voi helposti ymmärtää. HR -tunniste oli vain tapa lisätä yksinkertainen viiva asiakirjaan missä haluat. Suunnittele vain elementin ylä- tai alareunaa, jossa haluat linjan näkyvän, sijoittaa vaakasuoran viivan elementin yläosaan tai alaosaan, mutta yleensä HR-tunniste oli helpompi käyttää tähän tarkoitukseen.

HTML5: stä lähtien HR-tunnisteesta tuli semanttinen, ja se määrittelee nyt kappaletason temaattisen tauon, joka on keskeytys sisällön virrassa, joka ei takaa uutta sivua tai muuta voimakkaampaa rajapintaa. Se on aiheen muutos . Esimerkiksi HR-tunniste voi olla tarinan aikana tapahtuneen muutoksen jälkeen tai se voi viitata aiheen muutokseen vertailutiedostossa.

HR-määritykset HTML4: ssä ja HTML5: ssä

HTML4: ssä HR-tagille voidaan antaa yksinkertaisia ​​attribuutteja, kuten "align", "width" ja "noshade". Kohdistus voidaan asettaa vasemmalle, keskelle, oikealle tai perustelluksi. Leveys säädti vaakasuoran viivan leveyden oletusarvosta 100 prosenttia, joka laajensi rivin sivulle. Noshade-attribuutti tuotti tasaisen värilinjan varjostetun värin sijaan. Nämä attribuutit ovat vanhentuneita HTML5: ssä, ja sinun pitäisi käyttää CSS-tyyliä HTML-tyylisi HR-tunnisteiden tyylissä. Esimerkiksi HTML 4:


luo vaakasuoran viivan, jonka korkeus on 10 pikseliä.

CSS: n käyttäminen HTML5: n kanssa on 10 pikselin suuruinen vaakasuora viiva,

Horisontaalisen rivin tyylin käyttäminen CSS: llä antaa sinulle paljon vapautta suunnittelemaan verkkosivusi. Näet useita esimerkkejä HR-tunnisteiden tyypeistä tässä Style HR Tag -artikkelissa. Vain leveys- ja korkeustyypit ovat yhdenmukaisia ​​kaikissa selaimissa, joten kokeilua ja virheitä voi tarvita käytettäessä muita tyylejä. Oletusleveys on aina 100 prosenttia web-sivun tai vanhemman elementin leveydestä. Säännön oletuskorkeus on kaksi pikseliä.