Hypertext Markup Language, noto anche come HTML, viene utilizzato per creare applicazioni Web. I tag HTML, comunemente noti come elementi, sono l'aspetto più importante del linguaggio HTML. I tag HTML incorporano e visualizzano contenuto o informazioni nelle pagine web. Esistono due tipi di tag HTML: tag vuoto e contenitore.
Questo blog guiderà come lavorare con tag vuoti e contenitori in HTML.
Tag vuoti
I tag vuoti sono noti anche come ' singleton ' o ' vuoto ” tag. Il tag void non contiene mai alcun contenuto, ma è possibile specificare gli attributi. Questi tag non hanno un tag finale e possono contenere una barra rovesciata nel tag. Gli esempi di tag vuoti sono “
”, “”, “”, “
Sintassi
La sintassi per menzionare gli elementi void in HTML è la seguente:
< tag-vuoto />
Per vedere come lavorare con i tag vuoti, dai un'occhiata all'esempio qui sotto. Il '
Il tag ” è noto come tag di interruzione di riga e viene utilizzato per interrompere la riga:
< p > Tag HTML vuoti < fratello > La linea rompere Etichetta p >
L'output indica che '
Il tag ” ha interrotto la riga:
Possiamo aggiungere proprietà di stile CSS ai tag HTML. Il '
Il tag ” è un altro elemento vuoto che aggiunge una linea orizzontale alla pagina:
< ora stile = 'border-top: 3px rosso tratteggiato;' > La linea rompere Etichetta
p >
Il ' bordo superiore ' La proprietà CSS viene applicata al '
” con tre valori, uno è la larghezza del bordo che è uguale a “ 3px ”, lo stile del bordo è impostato come “ tratteggiato ” e il colore del bordo.
Produzione
Finora abbiamo discusso i tag HTML vuoti. Ora esamineremo i tag contenitore HTML nella prossima sezione.
Tag contenitore
I tag contenitore HTML sono costituiti da tre parti: tag iniziali, contenuto e tag finali. La sintassi del tag contenitore HTML è data come segue:
< inizio_giorno > Contenuto tag finale >Dai un'occhiata agli esempi di seguito per scoprire come funziona il tag contenitore in HTML.
Esempio 1: come aggiungere un paragrafo in HTML?
Il ' Il tag ” viene utilizzato per incorporare il paragrafo nel documento HTML:
< p > Questo è un tag di paragrafo p >Produzione
Esempio 2: come aggiungere intestazioni in HTML?
Esistono sei livelli di tag contenitore di intestazione che possono essere utilizzati per aggiungere intestazioni a una pagina web. Mettiamoli in un documento HTML per vedere come funzionano e appaiono su una pagina web:
< h1 > Linux h1 >< h2 > Linux h2 >
< h3 > Linux h3 >
< h4 > Linux h4 >
< h5 > Linux h5 >
< h6 > Linux h6 >
Produzione
Possiamo fornire lo stile in linea a questi tag. Considera l'esempio seguente, che mostra come applicare varie proprietà di stile CSS a questi tag:
< h1 stile = 'colore di sfondo: cardo; famiglia di caratteri: corsivo;' > Linux h1 >< h2 stile = 'background-color: grano; text-align: center;' > Linux h2 >
< h3 stile = 'colore di sfondo: pomodoro; colore: bianco;' > Linux h3 >
< h4 stile = 'font-family: 'Trebuchet MS'; background-color: yellowgreen;' > Linux h4 >
< h5 stile = 'colore di sfondo: viola;' > Linux h5 >
< h6 stile = 'colore di sfondo: fumo bianco;' > Linux h6 & gt
Ecco la spiegazione delle proprietà sopra indicate:
- Il ' colore di sfondo La proprietà ” aggiunge colore allo sfondo dell'elemento.
- “ famiglia di font La proprietà ” regola lo stile del carattere dell'elemento.
- “ allineamento del testo La proprietà ” regola la posizione o l'allineamento del testo.
Produzione
Ti abbiamo mostrato come utilizzare i tag vuoto e contenitore dell'HTML.
Conclusione
I tag vuoti e i tag contenitore sono componenti principali dei documenti HTML che incorporano il contenuto e le informazioni in una pagina web. I tag vuoti non contengono alcun contenuto e sono costituiti solo dal tag iniziale con una barra rovesciata alla fine, ad esempio
. Tuttavia, i tag contenitore contengono i tag iniziale e finale insieme al contenuto. Questo blog ha approfondito il funzionamento di elementi vuoti e contenitori in HTML.