Il tag HR viene utilizzato nei documenti Web per visualizzare una linea orizzontale attraverso la pagina o talvolta definita una regola orizzontale. A differenza di alcuni tag, questo non ha bisogno di un tag di chiusura, quindi tutto ciò che devi fare è digitare inserire la linea.
La linea si estende su tutta la larghezza della pagina e porta con sé alcuni attributi predefiniti per descrivere lo spessore, la posizione e il colore della linea, ma è possibile modificare tali impostazioni, se lo si desidera.
Puoi modificare le caratteristiche della linea orizzontale in un documento HTML5 modificando il CSS della pagina. Le linee orizzontali HTML4 sono state modificate sul lato HTML del documento.
L'etichetta delle risorse umane è semantica?
In HTML4, il tag HR non era semantico. Gli elementi semantici descrivono il loro significato in termini di browser e lo sviluppatore può facilmente capire. Il tag HR era solo un modo per aggiungere una linea semplice a un documento ovunque lo volessi. Disegnare solo il bordo superiore o inferiore dell'elemento in cui si desidera visualizzare la linea posizionata su una linea orizzontale nella parte superiore o inferiore dell'elemento, ma in generale, il tag HR è stato più facile da utilizzare per questo scopo.
A partire da HTML5, il tag HR è diventato semantico e ora definisce un'interruzione tematica a livello di paragrafo, ovvero un'interruzione nel flusso del contenuto che non garantisce una nuova pagina o un altro delimitatore più forte: è un cambiamento di argomento. Ad esempio, potresti trovare un tag HR dopo un cambio di scena in una storia, oppure può indicare un cambio di argomento in un documento di riferimento.
Attributi HR in HTML4 e HTML5
In HTML4, al tag HR possono essere assegnati attributi semplici inclusi allineare, larghezza, e noshade . L'allineamento può essere impostato su sinistra , centro , destra o giustificare . La larghezza regola la larghezza della linea orizzontale dal 100 percento predefinito che estende la linea attraverso la pagina. Il noshade attributo esegue il rendering di una linea di colore continuo anziché di un colore ombreggiato.
Questi attributi sono obsoleti in HTML5. Dovresti invece usare i CSS per modellare i tuoi tag HR nei documenti HTML5.
Questo è un esempio HTML5 di stilizzare la linea orizzontale ad essere alta 10 pixel usando CSS in linea (stili inseriti direttamente nel documento insieme all'HTML):
Un altro modo per stilizzare le linee orizzontali in HTML5 consiste nell'utilizzare un file CSS separato e collegarlo ad esso dal documento HTML. Nel file CSS, devi scrivere lo stile in questo modo: hr {Altezza: 10px}
Lo stesso effetto in HTML4 richiede l'aggiunta di un attributo al contenuto HTML. Ecco come cambiare la dimensione della linea orizzontale con il taglia attributo:
C'è molta più libertà nello stile di linee orizzontali nei CSS rispetto all'HTML. Solo il larghezza e altezza gli stili sono coerenti su tutti i browser, quindi potrebbero essere necessari alcuni tentativi ed errori quando si usano altri stili. La larghezza predefinita è sempre pari al 100 percento della larghezza della pagina Web o dell'elemento principale. L'altezza predefinita della regola è di due pixel.
