Lezione1: La mia prima pagina in HTML
Transcript
Lezione1: La mia prima pagina in HTML
Lezione1: La mia prima pagina in HTML Le istruzioni o comandi dell'HTML, chiamati TAG, si devono scrivere (sintassi del comando) nel seguente modo <nomeTag>informazione da rappresentare </nomeTag>, oppure <nomeTag attributo=“valore”>informazione da rappresentare </nomeTag >. Il nome del TAG generalmente è un acronimo significativo (nella lingua inglese) del comando associato: ad esempio: <u>Ciao Mondo</u> il nome del tag <u> è l'iniziale di underline, (sottolineato) e permette di sottolineare un testo. Nel nostro caso il browser rappresenterà: Ciao Mondo <b>Ciao Mondo</b> il nome del tag <b> è l'iniziale di bold, (grassetto) e permette di rappresentare il testo in grassetto. Nel nostro caso il browser rappresenterà: Ciao Mondo Una pagina HTML è costituita da due parti, l'intestazione e il corpo <html> <head> intestazione della pagina contenente descrizioni generali </head> <body> corpo della pagina con il contenuto vero e proprio </body> </html> In dettaglio, il tag <head> contiene informazioni molto importanti, per la maggior parte invisibili all'utente, tranne il titolo del documento che verrà visualizzato come titolo nella finestra del browser <head> <title> La mia prima pagina HTML </title> </head> Nota: poiché il titolo viene usato anche per costruire gli indici automatici usati dai motori di ricerca è importante che esso sia significativo Il tag <body> contiene tutto quello che verrà visualizzato secondo le direttive di formattazione. <body> corpo della pagina </body> Il tag <body> ha degli attributi importanti che permettono di stabilire l'aspetto grafico generale della pagina. Ad esempio impostare i colori. <body bgcolor="colore sfondo" text="colore testo" background="pathname del file con immagine per lo sfondo" link="colore link da visitare" alink="colore link attivo“ vlink="colore link visitati"> Il colore può essere specificato con • nomi del colore: red, green, yellow, ... • terna di valori numerici in codice esadecimale con codifica: Rosso Verde Blu (RGB) es. #000000 → nero es. #FFFFFF → bianco es. #FF0000 → rosso 00 = valore minimo per ciascun colore FF= valore massimo per ciascun colore (si ricorda che il numero FF in esadecimale corrisponde al 255 in decimale e che con la codifica RBG si possono impostare quindi 256*256*256 = 16777216 colori diversi) Per vedere i nomi dei colori validi in HTML, visita ad esempio il sito http://colorihtml.it/ Se non si specifica alcun attributo per il body, di default si ha: sfondo bianco, testo nero, link da visitare blu, link attivi rossi, link visitati viola. Per impostare una immagine di sfondo: <body background="pathname del file con immagine per lo sfondo"> Il pathname, ovvero il nome dell'immagine da applicare allo sfondo con il relativo percorso su dove trovarla, può essere scritto ad esempio nei modi seguenti: <body background="sfondo.jpg“> → è nella stessa cartella della pagina html <body background=“img/sfondo.jpg“> → è in una sottocartella img contenuta nella cartella che contiene la pagina html <body background=“../img/sfondo.jpg“> → è in una cartella img che sta allo stesso livello della cartella che contiene la pagina html Esercitazione 1: realizzare, utilizzando un editor di testi, una pagina html con le seguenti caratteristiche: • nome: pagina1.html • titolo: La mia prima pagina html • colore di sfondo: giallo • colore del testo: blu • testo da visualizzare: “Hello World” in grassetto Esercitazione 2: realizzare, utilizzando un editor di testi, una pagina html con le seguenti caratteristiche: • nome: pagina2.html • titolo: La mia seconda pagina html • immagine di sfondo: immagine a scelta libera in formato .jpg • colore del testo: rosso • testo da visualizzare: “Hello World” sottolineato