Tabella dei pių comuni elementi HTML
Gli elementi riportati di seguito rientrano nelle specifiche del W3C per
l'HTML 4.01. Per una completa e approfondita panoramica degli attributi
dell'HTML il riferimento più affidabile e completo è sempre
il sito del W3C.
Gli elementi sono stati suddivisi per categorie. Inoltre, per
distinguerli dagli attributi sono stati scritti in maiuscolo, mentre per gli
attributi è stato usato il carattere minuscolo. Questa scelta non
compromette la realizzazione dei nostri progetti, dal momento che l'HTML non
è un linguaggio case-sensitive: in altri termini non fa distinzione fra
maiuscole e minuscole.
Elementi radice
Elemento |
Attributi ammessi |
Descrizione |
html |
lang, dir (per indicare, dove ce ne fosse bisogno, la
direzione del testo)
|
Definisce, insieme a head, che racchiude i metatag o
elementi
meta, e a body, che delimita il corpo del documento, la struttura
fondamentale dei documenti HTML.
|
head |
profile, lang |
Questo elemento fornisce informazioni utili ai motori di
ricerca e ai
browser. In esso sono contenuti gli elementi meta, oltre al titolo della
pagina e a possibili informazioni riguardo lo stile. |
body |
id, class (identificatori unici nell'ambito del documento)
lang, title, style, bgcolor, onload, onunload, onclick, ondblclick, onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup
|
All'interno di esso di trova il "corpo" del documento: la
parte del
documento che viene interpretata dal browser. |
Elementi che si trovano nell'intestazione del documento, fra
<head> </head>
Elemento |
Attributi ammessi |
Descrizione |
link |
id, class, lang, dir, title, style, onclick, ondblclick,
onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup,
href, hreflang, type, rel, rev, target, media, charset |
Questo elemento appare solo fra HEAD e crea un collegamento a
un documento
esterno.
Comunemente viene usato per inserire fogli di stile esterni. Il codice che segue
< link rel = "stylesheet" href="stile.css"
type = "text/css" >
|
meta |
name, content, scheme, http-equiv (può essere usato al
posto di
name), lang
|
meta Si trova solo nella sezione head e serve
a inserire
infirmazioni sull'autore, il titolo, la lingua, la data di scadenza del
documento, e altri valori fra cui le parole chiave per l'indicizzazione del
documento da parte dei motori di ricerca.
|
style |
name, media, lang, title |
Si tratta di un elemento con il quale gli autori possono
attribuire uno
stile al documento e che risulta utile nel caso di interpreti che non supportano
i fogli di stile esterni. Il contenuto di STYLE dipende dal linguaggio usato
|
title |
lang, dir |
Questo elemento si trova all'interno di head e indica il
titolo del
documento.
|
Elementi basilari che fanno parte del corpo (body)
del documento
Elemento |
Attributi ammessi |
Descrizione |
a |
name, href, hreflang, langcode, type, rel, rev, charset, id,
class, lang, dir, title, style, shape e coords, onfocus, onblur, onclick,
ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout,
onkeypress, onkeydown, onkeyup, target, tabindex, accesskey |
Serve a creare un'ancora per un collegamento
ipertestuale. La sintassi da
usare è la seguente:
<a href= "indirizzo documento da
collegare.html" > nome documento </a>
|
div |
id, class, lang, dir, title , style, align, onclick,
ondblclick,
onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress,
onkeydown, onkeyup |
E' un elemento che "separa" una o
pi§ aree
del documento da altre aree,
anche per rendere possibile l'assegnazione di uno stile.
|
img |
src, longdesc, id, class, alt, lang, dir, title, style,
onclick, ondblclick,
onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress,
onkeydown, onkeyup, ismap, usemap, align, id, height, border, hspace,
vspace |
Lo scopo di questo elemento è inserire immagini nel
documento HTML.
Nota: Al posto di img si può usare
object.
|
object |
src, type, language, defer, charset |
Rende possibile inserire all'interno del documento un
oggeto generico,
che può essere anche un'immagine o un'applet, attraverso la
dichiarazione di un URI. Ecco un esempio di sintassi di object:
< p object
classid = " http://www.sito.it/oggetto.bin " >
|
script |
|
All'interno di questo elemento è possibile inserire
script che verranno
eseeguiti dal browser. |
span |
id, class, lang, dir, title , style, align, onclick,
ondblclick,
onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress,
onkeydown, onkeyup |
Mentre l'elemento DIV permette di creare dei blocchi a livello
di corpo del
documento, SPAN ottiene lo stesso risultato a livello di linea. |
Elementi che servono a definire le caratteristiche del testo
Elemento |
Attributi ammessi |
Descrizione |
p |
id, class, lang , dir (direzione del testo), title,
style, align, onclick, ondblclick, onmousedown, onmouseup, onmouseover,
onmousemove, onmouseout, onkeypress, onkeydown, onkeyup |
In un documento HTML i paragrafi sono delimitati dall'elemento
p.
|
h1, h2, h3, h4, h5 |
id, class, lang , dir (direzione del testo), title,
style, align,
onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove,
onmouseout, onkeypress, onkeydown, onkeyup |
Lo scopo di questi elementi
è creare delle intestazioni o dei titoli. La numerazione progressiva
indica dei livelli: h1 indica un titolo di
primo livello, il cui carattere avrà dimensioni maggiori rispetto al
carattere con cui sarà visualizzato il testo contenuto in h2, che
indica un titolo di secondo livello, e così via ...
|
em |
|
Indica enfasi. I browser visuali, in genere, lo
interpretano come
corsivo
|
strong |
id, class, lang , dir (direzione del testo), title, style,
align,
onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove,
onmouseout, onkeypress, onkeydown, onkeyup |
Indica enfasi rafforzata. I browser visuali, in genere, lo
interpretano come grassetto.
|
b |
id, class, lang , dir (direzione del testo), title, style,
align,
onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove,
onmouseout, onkeypress, onkeydown, onkeyup |
Stile di testo grassetto: il testo viene evidenziato dai
navigatori
visuali, generalmente, in grassetto.
|
i |
id, class, lang , dir (direzione del testo), title,
style, align,
onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove,
onmouseout, onkeypress, onkeydown, onkeyup |
Evidenzia il carattere. I browser visuali, in genere, lo
evidenziano
come corsivo. |
cite |
id, class, lang , dir (direzione del testo), title, style,
align,
onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove,
onmouseout, onkeypress, onkeydown, onkeyup |
Questo elemento si usa per indicare l'origine di
una citazione.
Ad esempio:
<cite> A.Manzoni </cite>
scrive nei <cite> Promessi sposi </cite>
< q> Quel ramo del
lago
di Como... </q> .
In combinazione con blockquote cite viene usato per
indicare l'origine della citazione.
Ad esempio:
< blockquote cite=" http://www.sito.com/testo.html " >
<p> Giunsero a destinazione di sera. Carlo spense il mortore e scese
dal furgone. L'asfalto era ancora bollente e una folata di vento ... </p>
< /blockquote >
|
q |
id, class, lang , dir (direzione del testo), title, style,
align,
onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove,
onmouseout, onkeypress, onkeydown, onkeyup |
Il contenuto della citazione può essere indicato con
Q o
con blockquote. Ad esempio:
<Q>Ipse dixit</Q>
La differenza fra i due elementi consiste nel fatto che
mentre q visualizza i testo all'interno di virgolette tipografiche,
blockquote presenta il testo indentato.
|
code |
id, class, lang , dir (direzione del testo), title, style,
align,
onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove,
onmouseout, onkeypress, onkeydown, onkeyup |
Viene usato per visualizzare le linee di codice. I
browser visuali in
genere applicano un carattere dattilografico per visualizzzarlo.
|
Le tabelle
Elemento |
Attributi ammessi |
Descrizione |
table |
summary ("riepilogo": facilita la presentazione della tabella
da parte degli
interpreti non visuali), width (con il quale si può specificare la
larghezza della tabella), id, class, lang, dir, title, style, onclick,
ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout,
onkeypress, onkeydown, onkeyup, bgcolor, frame, rules, border, cellspacing,
cellpadding |
Tutti gli elementi di una tabella sono contenuti in
<table></table>
|
caption |
id, class, lang, dir, title, style, onclick, ondblclick,
onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown,
onkeyup |
Non č un elemento obbligatorio e può essere posto
solo subito
dopo il tag iniziale di tabella (<table>). Visualizza un'intestazione,
posta sopra il margine superiore della tabella, che chiarisce meglio il
contenuto della tabella stessa.
|
thead |
id, class, lang, dir, title, style, onclick, ondblclick,
onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup,
align, char, charoff, valign |
È usato quando si deve creare un'intestazione per la
tabella |
tfoot |
id, class, lang, dir, title, style, onclick, ondblclick,
onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup,
align, char, charoff, valign |
tfoot serve per creare il piede di tabella. Deve apparire
prima di
TBODY e dopo di thead |
tbody |
id, class, lang, dir, title, style, onclick, ondblclick,
onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup,
align, char, charoff, valign |
Corpo della tabella: i dati della tabella sono contenuti
all'interno di
questo elemento |
tr |
id, class, lang, dir, title, style, onclick, ondblclick,
onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup,
align, char, charoff, valign |
Definisce le righe della tabella. È un elemento
obbligatorio. |
th |
headers, scope, row, col, rowgroup, colgroup, abbr, axis,
rowspan,
colspan, id, class, lang, dir, title, style, onclick, ondblclick, onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup,
bgcolor, align, char, charoff, valign
|
Anche le righe di tabella, allo stesso modo che la tabella
tutta
intera, possono avere un'intestazione: TH serve a creare un'intestazione di
riga
|
td |
headers, scope, row, col, rowgroup, colgroup, abbr, axis,
rowspan, colspan,
id, class, lang, dir, title, style, onclick, ondblclick, onmousedown, onmouseup,
onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup, bgcolor,
align, char, charoff, valign
|
Definisce le colonne della tabella. È un elemento
obbligatorio, sebbene
possa anche essere vuoto. |
I moduli
Elemento |
Attributi ammessi |
Descrizione |
form |
action, method, enctype, accept-charset, accept |
La funzione dell'elemento form è creare uno spazio per inserire dati nella pagina web.
|
input |
type, name, value, size, maxlength, checked, src |
Il tag iniziale
è obbligatorio, mentre quello finale è proibito. L'elemento input crea finestre o un bottoni per inserire dati o specificare preferenze
|
button |
|
È usato quando si deve creare un'intestazione per la
tabella |
tfoot |
id, class, lang, dir, title, style, onclick, ondblclick,
onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup,
align, char, charoff, valign |
tfoot serve per creare il piede di tabella. Deve apparire
prima di
TBODY e dopo di thead |
tbody |
id, class, lang, dir, title, style, onclick, ondblclick,
onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup,
align, char, charoff, valign |
Corpo della tabella: i dati della tabella sono contenuti
all'interno di
questo elemento |
tr |
id, class, lang, dir, title, style, onclick, ondblclick,
onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup,
align, char, charoff, valign |
Definisce le righe della tabella. È un elemento
obbligatorio. |
th |
headers, scope, row, col, rowgroup, colgroup, abbr, axis,
rowspan,
colspan, id, class, lang, dir, title, style, onclick, ondblclick, onmousedown,
onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup,
bgcolor, align, char, charoff, valign
|
Anche le righe di tabella, allo stesso modo che la tabella
tutta
intera, possono avere un'intestazione: TH serve a creare un'intestazione di
riga
|
td |
headers, scope, row, col, rowgroup, colgroup, abbr, axis,
rowspan, colspan,
id, class, lang, dir, title, style, onclick, ondblclick, onmousedown, onmouseup,
onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup, bgcolor,
align, char, charoff, valign
|
Definisce le colonne della tabella. È un elemento
obbligatorio, sebbene
possa anche essere vuoto. |
|
|
|