Znacznik HR jest używany w dokumentach internetowych do wyświetlania poziomej linii na całej stronie lub czasami nazywanej regułą poziomą. W przeciwieństwie do niektórych tagów, ten nie potrzebuje tagu zamykającego, więc wszystko co musisz zrobić, to wpisać wstawić linię.
Linia rozciąga się na całej szerokości strony i zawiera pewne domyślne atrybuty opisujące grubość, położenie i kolor linii, ale możesz zmienić te ustawienia, jeśli chcesz.
Możesz edytować charakterystykę linii poziomej w dokumencie HTML5, edytując CSS strony. Poziome linie HTML4 zostały zmienione po stronie HTML dokumentu.
Czy HR Tag Semantic?
W HTML4 znacznik HR nie był semantyczny. Elementy semantyczne opisują ich znaczenie w kategoriach przeglądarki, a programista może z łatwością zrozumieć. Znacznik HR był po prostu sposobem dodania prostej linii do dokumentu, gdziekolwiek go zapragniesz. Stylizowanie tylko górnej lub dolnej krawędzi elementu, w którym ma się pojawić linia, zawierało poziomą linię u góry lub u dołu elementu, ale ogólnie rzecz biorąc, znacznik HR był łatwiejszy do użycia w tym celu.
Począwszy od HTML5 znacznik HR stał się semantyczny i teraz definiuje podział tematyczny na poziomie akapitu, który jest przerwą w przepływie treści, która nie gwarantuje nowej strony lub innego silniejszego ogranicznika - jest to zmiana tematu. Na przykład możesz znaleźć tag HR po zmianie sceny w opowiadaniu lub może on wskazywać na zmianę tematu w dokumencie referencyjnym.
Atrybuty HR w HTML4 i HTML5
W HTML4 znacznikowi HR można przypisać atrybuty proste, w tym wyrównaj, szerokość, i noshade . Wyrównanie można ustawić na lewo , środek , dobrze lub uzasadniać . Szerokość dostosowuje szerokość poziomej linii do domyślnego 100 procent, który rozszerza linię na całej stronie. The noshade atrybut renderuje jednolitą linię kolorów zamiast cieniowanego koloru.
Te atrybuty są przestarzałe w HTML5. Zamiast tego należy użyć CSS do stylizowania tagów HR w dokumentach HTML5.
To jest przykład HTML5 stylizowania poziomej linii na 10 pikseli wysokości przy użyciu wbudowanego CSS (style wstawiane bezpośrednio do dokumentu wraz z HTML):
Innym sposobem na stylizowanie poziomych linii w HTML5 jest użycie oddzielnego pliku CSS i połączenie go z dokumentem HTML. W pliku CSS napiszesz taką stylizację: hr {wysokość: 10 pikseli}
Ten sam efekt w HTML4 wymaga dodania atrybutu do treści HTML. Oto jak zmienić rozmiar poziomej linii za pomocą rozmiar atrybut:
Jest dużo więcej swobody w układaniu linii poziomych w CSS w porównaniu z HTML. Tylko szerokość i wysokość style są spójne we wszystkich przeglądarkach, więc podczas używania innych stylów może być potrzebna próba i błąd. Domyślna szerokość to zawsze 100 procent szerokości strony internetowej lub elementu nadrzędnego. Domyślna wysokość reguły to dwa piksele.
