HTML
introduzione
HTML sta per Hyper Text Markup Language.È un linguaggio di formattazione utilizzato per definire l'aspetto e il contenuto di una pagina web. Ci consente di organizzare testo, grafica, audio e video su una pagina web.
Key Points:
La parola ipertesto si riferisce al testo che funge da collegamento.
Il markup verbale si riferisce ai simboli utilizzati per definire la struttura del testo. I simboli di markup indicano al browser come visualizzare il testo e sono spesso chiamati tag.
La parola Lingua si riferisce alla sintassi che è simile a qualsiasi altra lingua.
HTML è stato creato da Tim Berners-Lee a CERN.
Versioni HTML
La tabella seguente mostra le varie versioni di HTML:
Versione | Anno |
---|---|
HTML 1.0 | 1991 |
HTML 2.0 | 1995 |
HTML 3.2 | 1997 |
HTML 4.0 | 1999 |
XHTML | 2000 |
HTML5 | 2012 |
Tag HTML
Tag è un comando che dice al browser web come visualizzare il testo, l'audio, la grafica o il video su una pagina web.
Key Points:
I tag sono indicati con una coppia di parentesi angolari.
Iniziano con un carattere minore di (<) e terminano con un carattere maggiore di (>).
Il nome del tag è specificato tra parentesi angolari.
La maggior parte dei tag di solito si verificano in coppia: il tag di inizio e il tag di chiusura.
Il tag di inizio è semplicemente il nome del tag è racchiuso tra parentesi angolari mentre il tag di chiusura è specificato includendo una barra (/).
Alcuni tag sono vuoti, cioè non hanno il tag di chiusura.
I tag non fanno distinzione tra maiuscole e minuscole.
Il nome del tag di inizio e di chiusura deve essere lo stesso. Ad esempio <b> ciao </i> non è valido poiché entrambi sono diversi.
Se non specifichi le parentesi angolari (<>) per un tag, il browser tratterà il nome del tag come un semplice testo.
Il tag può anche avere attributi per fornire ulteriori informazioni sul tag al browser.
Tag di base
La tabella seguente mostra i tag HTML di base che definiscono la pagina Web di base:
Etichetta | Descrizione |
---|---|
<html> </html> | Specifica il documento come una pagina web. |
<head> </head> | Specifica le informazioni descrittive sui documenti Web. |
<title> </title> | Specifica il titolo della pagina web. |
<body> </body> | Specifica il corpo di un documento Web. |
Il codice seguente mostra come utilizzare i tag di base.
<html>
<head> Heading goes here…</head>
<title> Title goes here…</title>
<body> Body goes here…</body>
</html>
Formattazione dei tag
La tabella seguente mostra i tag HTML utilizzati per la formattazione del testo:
Etichetta | Descrizione |
---|---|
<b> </b> | Specifica il testo in grassetto. Per esempio.this is bold text |
<em> </em> | È un testo di frase. Specifica il testo enfatizzato. Per esempio. Testo enfatizzato |
<strong> </strong> | È un tag frase. Specifica un testo importante. Per esempio. this is strong text |
<i> </i> | Il contenuto del tag corsivo viene visualizzato in corsivo. Per esempio. Testo in corsivo |
<sub> </sub> | Specifica il testo in pedice. Per esempio. X 1 |
<sup> </sup> | Definisce il testo in apice. Per esempio. X 2 |
<ins> </ins> | Specifica il testo inserito. Per esempio. Il prezzo della penna è ora |
<del> </del> | Specifica il testo eliminato. Per esempio. Il prezzo della penna è ora |
<mark> </mark> | Specifica il testo contrassegnato. Per esempio. Èpiove |
Tag della tabella
La tabella seguente descrive i tag di tabella comunemente utilizzati:
Etichetta | Descrizione |
---|---|
<table> </table> | Specifica una tabella. |
<tr> </tr> | Specifica una riga nella tabella. |
<th> </th> | Specifica la cella di intestazione nella tabella. |
<td> </td> | Specifica i dati in una cella della tabella. |
<caption> </caption> | Specifica la didascalia della tabella. |
<colgroup> </colgroup> | Specifica un gruppo di colonne in una tabella per la formattazione. |
Elenca tag
La tabella seguente descrive i tag di elenco utilizzati comunemente:
Etichetta | Descrizione |
---|---|
<ul> </ul> | Specifica un elenco non ordinato. |
<ol> </ol> | Specifica un elenco ordinato. |
<li> </li> | Specifica un elemento dell'elenco. |
<dl> </dl> | Specifica un elenco di descrizioni. |
<dt> </dt> | Specifica il termine in un elenco di descrizioni. |
<dd> </dd> | Specifica la descrizione del termine in un elenco di descrizioni. |
Cornici
Framesaiutaci a dividere la finestra del browser in più aree rettangolari. Ogni regione contiene una pagina web html separata e ognuna di esse funziona in modo indipendente.
Un insieme di frame nell'intero browser è noto come frameset. Indica al browser come dividere la finestra del browser in frame e le pagine web che ciascuna deve caricare.
La tabella seguente descrive i vari tag utilizzati per la creazione di frame:
Etichetta | Descrizione |
---|---|
<frameset> </frameset> | È la sostituzione del tag <body>. Non contiene i tag normalmente utilizzati nell'elemento <body>; invece contiene l'elemento <frame> usato per aggiungere ogni frame. |
<frame> </frame> | Specifica il contenuto di diversi frame in una pagina Web. |
<base> </base> | Viene utilizzato per impostare il frame di destinazione predefinito in qualsiasi pagina che contiene collegamenti i cui contenuti sono visualizzati in un altro frame. |
Forme
Formsvengono utilizzati per inserire i valori. Questi valori vengono inviati al server per l'elaborazione. Forms utilizza elementi di input come campi di testo, caselle di controllo, pulsanti di opzione, elenchi, pulsanti di invio, ecc. Per inserire i dati in esso.
La tabella seguente descrive i tag comunemente usati durante la creazione di un modulo:
Etichetta | Descrizione |
---|---|
<form> </form> | Viene utilizzato per creare un modulo HTML. |
<input> </input> | Specifica il campo di input. |
<textarea> </textarea> | Specifica un controllo dell'area di testo che consente di inserire testo su più righe. |
<label> </label> | Specifica l'etichetta per un elemento di input. |