docwww.webmasterpoint.org Html > Guida html
download 
Reclamo Transcript
www.webmasterpoint.org Html > Guida html
html www.webmasterpoint.org Html > Guida html Obiettivo: la prima pagina web Barra del titolo Immagine di sfondo Testo con colore blu Il tuo primo file <html> <head><title> La mia pagina in html! </title></head> </html> Questo file html crea una pagina web vuota con un titolo sulla barra del titolo del browser Va creato con il blocco note e salvato in formato «htm» nella vostra cartella con il nome pag1.html Risultato dell’esempio Procedimento • Aprite il blocco note • Salvatelo un file sul desktop con nome pag1 ed estensione html (non txt) • Inserite il codice all’interno • Salvate ancora e chiudete • Apritelo ora con il browser Il primo file Html utilizza i TAGS detti in italiano «marcatori» che sono comandi inseriti tra due «parentesi angolari» <html> <html> </html> <head> Sono i due marcatori di inizio e fine linguaggio html: sono inseriri per primo e per ultimo <title> La mia pagina in html! </title> <head></head> </head> Sono i due marcatori che indicano la «testa» cioè le proprietà del documento (titolo, autore, </html> descrizione) <title> La mia pagina in html! <title> Il titolo del documento, che appare nella barra del titolo del browser, va inserito tra i tags <head> Il primo file Aggiungiamo un contenuto nella pagina web: <html> <head><title> La mia pagina in html! </title></head> <body> Questo è il primo file html! </body> </html> Il risultato: Il tag body • Il tag body cambia la formattazione della pagina web. • In una pagina web può esserci una sola coppia di tag body • <body> </body> Colore di sfondo • <body bgcolor="yellow"> • L’attributo bgcolor indica il colore dello sfondo, per esempio possiamo scrivere: <html> <head><title> La mia pagina in html! </title></head> <body bgcolor="yellow"> Questo è il primo file html! </body> </html> bgcolor Altre forme dell’attributo bgcolor • <body bgcolor="yellow"> • <body bgcolor=“#00FFAA”> • <body background=“imagine.jpg"> • Possiamo usare un colore generico usando I numeri esadecimali (0,1,2….8,9,A,B,C,D,E,F) • Possiamo anche caricare una imagine di sfondo posta nella stessa cartella del nostro file page1.html (gif,jpg,bmp) Colori • I colori possono essere richiamati con un codice esadecimale ed usando il simbolo «#» Es.: #33AAFF • Il formato del codice è RGB (red, green, blu), quindi: • Le prime due cifre indicano la quantità di rosso • Le seconde due cifre indicano la quantità di verde • Le ultime due cifre il blu. • Più salgo di valore più il colore è chiaro. • Es: colore blu chiaro è AA AA FF • Es.: colore rosso chiaro è FF AA AA • <body text=#AA0088> • Con questa forma del tag body posso cambiare il colore del testo. • <body link=#0000c0 vlink=#000080 alink=#0000ff> • Con questi attributi cambio: • Link = colore collegamenti • Alink = colore quando il mouse passa sul collegamento • Vlink = colore link già visitato Attributi multipli • Osservazione: se voglio cambiare più cose devo comunque • usare il tag body una unica volta • per cui vanno usati attributi multipli • Gli attributi vanno separati da un semplice spazio • Concludendo il tag body va chiuso a fondo pagina, di solito prima del tag html così: • </body></html> Esempio • <html> • <head><title> La mia pagina in html! </title></head> • <body bgcolor="#ddeeff" text=#332233 > • Questo è il primo file html! </body> • </html> Esercizi • • • • Cambiare il titolo in: «La mia Home Page !» Cambiare il colore del testo in blu Cambiare il colore dello sfondo in verde chiaro Cambiare lo sfondo inserendo la immagine http://xn-80aqafcrtq.cc/img/1/7/5/175113.jpg presa dal web • Scrivere un altro rigo contenente le vostre generalità (nome, cognome…. ) • Provate un altro colore per il testo, immagine di sfondo e contenuti del testo e titolo. • Salvate e inviate sul «Quaderno elettronico»
