CREARE SITI WEB in HTML e CSS > Tabella riassuntiva sull'HTML
Come per i Fogli Stile, riassumiamo in una tabella riepilogativa, gli elementi HTML analizzati.
Programma di aiuto per creare codice HTML (e CSS):
Elementi e attributi HTML
Tabella 1codice | descrizione |
<!DOCTYPE HTML PUBLIC... > | tipo di documento |
<html></html> | inizio e fine della pagina html |
<head></head> | inizio e fine delle informazioni (non visibili, eccetto il titolo) |
<title></title> | titolo della pagina (da inserire tra i tag "head") |
<body></body> | inizio e fine del corpo della pagina (la parte visibile) |
<br /> | fine riga; manda a capo il testo successivo |
<h1></h1> | titolo 1 (titolo principale) |
<h2></h2> | titolo 2 (sottotitolo) |
<h3></h3> | titolo 3 (sotto-sottotitolo) |
<h4></h4> | titolo 4 |
<h5></h5> | titolo 5 |
<h6></h6> | titolo 6 |
<!-- --> | tag di commenti (ignorati dal browser) |
<!-- qui scrivo commenti --> | esempio di commenti in HTML |
<div></div> | inizio e fine di un blocco o di una sezione |
<div class="sfgiallo"></div> | esempio di classe applicata al tag DIV |
<div id="colonna1"></div> | esempio di identificatore applicato al tag DIV |
Tabella 2
codice | descrizione |
<img /> | tag per l'inserimento di immagini |
src="" | attributo link immagine |
alt="" | attributo testo alternativo (quando non viene caricata l'immagine) |
title="" | attributo titolo (appare quando si porta il puntatore sopra l'immagine) |
height="" | attributo altezza immagine |
width="" | attributo larghezza immagine |
<img src="immagini/colosseo.jpg" /> | esempio di immagine inserita con l'attributo di base src |
<img src="immagini/colosseo.jpg" alt="colosseo" title="il colosseo visto da nord" height="150" width="200" /> | esempio di immagine inserita, con più attributi |
Tabella 3
codice | descrizione |
<a></a> | tag per creare collegamenti ipertestuali(link) |
href="" | attributo indirizzo della risorsa da collegare |
<a href="citta-nelmondo. html">città nel mondo</a> | esempio di link completo |
Altri elementi HTML presenti nel layout di base n.7 (d'esempio), ma non analizzati nelle lezioni precedenti:
Tabella 4
codice | descrizione |
<p></p> | tag di inizio e fine paragrafo (dopo la chiusura c'è il cambio di riga) |
<strong></strong> | tag di inizio e fine che indica enfasi rafforzata; utile per evidenziare fortemente una parola o parte di testo (dopo la chiusura non c'è cambio di riga) |