Guide

Corso HTML – Lezione 2: I tag

Osservando il codice sorgente di una qualsiasi pagina HTML è possibile notare come il testo sia racchiuso all’interno di numerosi elementi di contenimento caratterizzati da due parentesi angolare ( i simboli ” < ” e ” > ” ) : essi prendono il nome di tag e permettono di definire la struttura della pagina web .

La maggior parte dei tag necessita di essere chiuse mediante un tag di chiusura , ovvero un tag identico a quello di apertura , eccezzion fatta per il simobolo ” / ” iniziale ; la visualizzazione di una sezione di testo di una pagina web è condizionata dal tipo di tag che la racchiude al proprio interno .

Il tag html è così formato :
<html>
Il corrispondente tag di chiusura è quindi il seguente :                                                                
</html>

La diposizione dei tag nella pagina HTML deve seguire uno schema di annidamento rigoroso , analogo a quello delle parentesi in un’espressione matematica : un tag aperto all’interno di un altro tag deve necessariamente essere chiuso prima del tag di chiusura del tag più esterno .

Il tag <body>, inserito all ‘ interno del tag <html> , dovrà essere chiuso prima della chiusura del tag più esterno :
<html>
    <body>
    </body> 
</html>
La seguente struttura risulta invece errata :
<html>
<body>
</html>
</body>
 [box type=”info” ]Una pagina web in linguaggio HTML può essere scritta utilizzando un qualsiasi editor di testo – come ad esempio il programma ” blocco note ” del sistema operativo Windows oppure il ” text edit ” del sistema operativo Mac OS – ma è preferibile ricorrere a strumenti che evidenzino la presenza dei tag nel testo della pagina e che ne verifichino la correttezza della chiusura e dell ‘ annidamento . I file di testo che contengono codice HTML sono normalmente salvati con estensione .html .[/box]

In quasi tutti i tipi di tag è possibile inserire uno o più attributi  utilizzati per definire alcune impostazioni relative al contenuto del tag stesso ; gli attributi devono essere posti immediatamente dopo il nome del tag e sono composti da due parti : la prima , a sinistra del simobolo ” = ”  ( uguale ), è il nome dell’attributo , la seconda , a destra del simobolo ” = ” ( uguale )e compresa tra due simboli ” ( virgolette ) è l’argomento :

<tag attributo="argomento">

Il tag <img> , utilizzato per incorporare immagini ll’interno della pagina web , necessita dell’attributo src  che specifica il nome (comprensivo  del percorso , o dell’indirizzo in cui si trova ) del file contenente l’immagine :

<img src="immagine.jpg">

[box type=”info” ]Esistono due diversi tipi di attributi : gli attributi standard e gli attributi di evento . I primi definiscono dimensioni , collegamente , misure , mentre i secondi specificano quali aspetti devono essere adottati in determinate situazioni , per esempio al click mediante il mouse o al passaggio del puntatore .[/box]

Il contenuto  del tag è infine il testo inserito fra il tag di apertura e il corrispondente tag di chiusura :

<body>
Lorem ipsum dolor sit amet
</body>

Esistono infine i tag di commento ,  che non sono presi in considerazione dal browser e che sono quindi utilizzati esclusivamente per aggiungere considerazioni o istruzioni all’interno del codice , in modo da semplificare l’organizzazione del lavoro e avere delle linee guida in una futura modifica della pagina . Essi hanno la seguente struttura :

<!-- commento non visualizzato dal browser -->

[box type=”info” ]Il linguaggio HTML non è case – sensitive , il che significa che non vi è distinzione fra le lettere maiuscole e minuscole nella scrittura del codice . Inoltre lo spazio lasciato fra una parola e l’altra del testo viene interpretato dal browser come un singolo spazio , indipendentemente da quanti essi siano realmente nel codice . Nel caso sia necessario inserire più di uno spazio all’interno di una frase , si utilizza il simbolo speciale &nbsp : [/box]

Lorem ipsum   dolor sit amet

[divider]

© Copyright 2013 Informatblog.com. E’ vietata la riproduzione, anche parziale , di immagini , testi o contenuti senza autorizzazione.
Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Le guide più interessanti