TAG HTML | Principali tag di formattazione

hello-world

Abbiamo detto nel precedente articolo che all’interno di ogni pagina è presente una serie di marcatori, i cosiddetti TAG, a cui viene affidata la visualizzazione e che hanno differenti nomi a seconda della loro funzione. I tag vanno inseriti tra parentesi uncinate (<TAG>) e la chiusura del tag viene indicata con una “/”, ossia lo “slash” (</TAG>).
Il contenuto va ovviamente inserito all’interno del tag medesimo.

<b attributi>contenuto</b>

Gli attributi dei TAG sono svariati. La loro struttura è attributo=”valore”. Quindi la struttura del tag diviene la seguente.

<b attributo_1="valore1" attributo_2="valore2" attributo_3="valore3">contenuto</b>

Volendo fare un esempio pratico, giustifichiamo un paragrafo al centro.

<P align="center">testo</p>

Alcuni tag, come quello per inserire un’immagine (img) non hanno contenuto, e di conseguenza non hanno neanche la chiusura.

Maiuscolo o minuscolo?

L’HTML è “case unsensitive“, cioè indipendente dal formato maiuscolo o minuscolo.
Tempo fa era buona norma scrivere il nome del tag in maiuscolo e gli attributi in minuscono, oggi invece è consigliabile scrivere tutto in minuscolo.

Principali tag di impostazione per un documento html

<html> <!-- racchiude tutti i tag in un documento HTML e lo definisce come un documento HTML -->
<head> <!-- racchiude i tag titolo e contiene titoli del documento ed informazioni di progettazione per il documento -->
<title> <!-- racchiude il titolo per il documento -->
</title> <!-- chiude il title -->
</head> <!-- chiude l'head -->
<body> <!-- racchiude tutti i tag che formano un documento -->
</body> <!-- chiude il body -->
</html> <!-- chiude l'html -->

Principali tag di formattazione del documento

<H1> </H1> è un tag di testata che crea il testo di dimensioni più grande. Il numero di tag di testata può variare da 1 a 6. Incrementando il numero rende più piccolo il testo

<P> </P> crea paragrafi
<BR> </BR> crea una interruzione di linea

<B> </B> rende il testo in grassetto

<STRONG> </STRONG> rende il testo in grassetto

<I> </I> rende il testo in corsivo

<U> </U> sottolinea il testo

<CENTER> </CENTER> centra il testo

<FONTCOLOR=”nome del colore”> </FONT> assegna al testo un colore

Collegamenti

<A HREF=”indirizzo da linkare”> </A> inserisce un collegamento

Tabelle

<TABLE> </TABLE> crea tabelle. Questo paio di tag racchiude tutti gli elenchi di tag per ognuno degli elementi nell’elenco

<TR> </TR> crea la riga di una tabella. Questo paio di tag racchiude tutti i tag di celle nella tabella

<TD> </TD> crea celle in una tabella

Elenchi ordinati

<OL> </OL> crea un elenco ordinato. Questo paio di tag racchiude tutti i tag di celle nell’elenco

<LI> </LI> racchiude l’elenco degli elementi

Elenchi

<UL> </UL> crea un elenco non ordinato. Questo paio di tag racchiude tutti i tag di celle nell’elenco

<LI> </LI> racchiude l’elenco degli elementi

Commenti

Una strategia importante, per rendere il nostro codice più leggibile è quella di inserire dei “commenti” nei punti più significativi: si tratta di indicazioni significative per i webmaster, ma invisibili al browser.
Inserire i commenti in punti specifici del documento ci permette di mantenere l’orientamento anche in file molto complessi e lunghi.
[HTML][/HTML]

TAG HTML | Principali tag di formattazione

Maiuscolo o minuscolo?

Principali tag di impostazione per un documento html

Principali tag di formattazione del documento

Collegamenti

Tabelle

Elenchi ordinati

Elenchi

Commenti

Ti potrebbero interessare anche:

Icon Font Awesome. Come inserire sul sito icone tramite font

Testare sito mobile online. Effettua il test con Google

What colour is it? L’orologio esadecimale

Come creare una sfumatura con CSS3

Ombra CSS3. Come aggiungerla a testo, div e immagini

Come smussare angoli di immagini e div con CSS3 Border Radius

Mappa del mondo con ingrandimento in jQuery

Arriva Atlas, la concorrenza di Facebook a Google

La base della sintassi di jQuery: $(document) .ready()

PHP: gestire le condizioni con le istruzioni if e else