SlideShare a Scribd company logo
Strumenti per il web design [ <a href=“#”> ]
header content footer contenitore
header content footer contenitore <!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;> <html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;> <head> <title>Titolo</title> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;stile.css&quot; /> </head> <body> <div id=&quot;contenitore&quot;> <div id=&quot;header&quot;></div> <div id=&quot;content&quot;> <p> Fa parlare i numeri <b>Antonio Martone</b>. E già la cifra, <br>oltre 4.000  proclamazioni in due anni, basta al <i>presidente della Commissione  di garanzia</i> degli scioperi nei servizi pubblici  essenziali, per condividere, con il governo, la necessità </p> </div> <div id=&quot;footer&quot;></div> </div> </body> </html> HTML
header content footer contenitore CSS #content { width:850px; margin:auto; background:#fff; } #footer{ display:block; width:850px; height:100px; margin:auto; background:#F2A30F; } * { margin: 0px; padding: 0px; border: 0px; font-family: arial, helvetica, sans-serif; } body { background:#F5FFD8; } #contenitore { width: 900px; margin: auto; background: #cccccc; } #header{ width: 850px; height: 200px; margin: auto; background:#C4D929; }
Colori http://kuler.adobe.com   La 'tavolozza Web' è un insieme di 216 colori. Un PC dotato di scheda video a 256 colori può mostrare solo 216 colori fissi in modo affidabile e quando un browser non dispone  di determinati colori, prova a &quot;crearli&quot;, mescolando pixel di colori. I l colore ottenuto è simile a quello non disponibile, ma non è il colore realmente impostato.  Esiste però la possibilità di una codifica HTML diretta conoscendo  il valore decimale di ciascun colore.  Nel codice HTML ciascun valore è formato da sei cifre, precedute dal simbolo #: i colori del Web sono formati da tre coppie di cifre identiche, essendo tutte le cifre multiple di 3 (cioè 0, 3, 6, 9, C, F).
Sfondo http://www.stripegenerator.com   La scelta dello sfondo della nostra pagina  Web è strettamente legata al tipo di  progetto che stiamo realizzando. Lo sfondo può essere realizzato con una tinta unita oppure con dei gradienti di colore, oppure ancora con delle immagini che possono essere moltiplicate per tutta la grandezza dello sfondo

More Related Content

Viewers also liked

Web usability for children
Web usability for childrenWeb usability for children
Web usability for childrenSilvia Carbotti
 
Lezione 1
Lezione 1Lezione 1
Lezione 1
Silvia Carbotti
 
web usability for kids / completo
web usability for kids / completoweb usability for kids / completo
web usability for kids / completoSilvia Carbotti
 

Viewers also liked (6)

23 novembre
23 novembre23 novembre
23 novembre
 
Convegno 24aprile
Convegno 24aprileConvegno 24aprile
Convegno 24aprile
 
Web usability for children
Web usability for childrenWeb usability for children
Web usability for children
 
Prezentacja
PrezentacjaPrezentacja
Prezentacja
 
Lezione 1
Lezione 1Lezione 1
Lezione 1
 
web usability for kids / completo
web usability for kids / completoweb usability for kids / completo
web usability for kids / completo
 

Similar to Lezione 3

Web writing 2
Web writing 2Web writing 2
Web writing 2
icferrucci
 
I Linguaggi Del Web (1° Giornata)
I Linguaggi Del Web (1° Giornata)I Linguaggi Del Web (1° Giornata)
I Linguaggi Del Web (1° Giornata)
Diego La Monica
 
Corso HTML per l'editoria
Corso HTML per l'editoriaCorso HTML per l'editoria
Corso HTML per l'editoria
Diego La Monica
 
HTML e CSS Prima Lezione
HTML e CSS Prima LezioneHTML e CSS Prima Lezione
HTML e CSS Prima Lezione
Ivan Buccella
 
Presentazione Corso - Parte 1
Presentazione Corso - Parte 1Presentazione Corso - Parte 1
Presentazione Corso - Parte 1
Giorgio Carpoca
 
Lab Web Prof.Di Blasi 2008
Lab Web Prof.Di Blasi 2008Lab Web Prof.Di Blasi 2008
Lab Web Prof.Di Blasi 2008ninam87
 
Lab Web Prof.Di Blasi 2008
Lab Web Prof.Di Blasi 2008Lab Web Prof.Di Blasi 2008
Lab Web Prof.Di Blasi 2008alexzaffi86
 
Html e CSS ipertesti e siti web 4.5
Html e CSS   ipertesti e siti web 4.5Html e CSS   ipertesti e siti web 4.5
Html e CSS ipertesti e siti web 4.5
orestJump
 
css
csscss
Css
CssCss
Sviluppare estensioni per google chrome
Sviluppare estensioni per google chromeSviluppare estensioni per google chrome
Sviluppare estensioni per google chrome
Marco Vito Moscaritolo
 
Css1
Css1Css1
CSS corso base (classi seconde, mod 1)
CSS corso base (classi seconde, mod 1)CSS corso base (classi seconde, mod 1)
CSS corso base (classi seconde, mod 1)
Matteo Ziviani
 
Html
HtmlHtml
Breve introduzione alle tecnologie HTML5 + (DOM) + CSS
Breve introduzione alle tecnologie HTML5 + (DOM) + CSS Breve introduzione alle tecnologie HTML5 + (DOM) + CSS
Breve introduzione alle tecnologie HTML5 + (DOM) + CSS
Giuseppe Vizzari
 
HTML (+ DOM) + CSS
HTML (+ DOM) + CSSHTML (+ DOM) + CSS
HTML (+ DOM) + CSS
Giuseppe Vizzari
 

Similar to Lezione 3 (20)

Dal Click Al Web Server
Dal Click Al Web ServerDal Click Al Web Server
Dal Click Al Web Server
 
Lezione HTML
Lezione HTMLLezione HTML
Lezione HTML
 
Fogli di stile CSS
Fogli di stile CSSFogli di stile CSS
Fogli di stile CSS
 
Web writing 2
Web writing 2Web writing 2
Web writing 2
 
I Linguaggi Del Web (1° Giornata)
I Linguaggi Del Web (1° Giornata)I Linguaggi Del Web (1° Giornata)
I Linguaggi Del Web (1° Giornata)
 
Html Base
Html BaseHtml Base
Html Base
 
Corso HTML per l'editoria
Corso HTML per l'editoriaCorso HTML per l'editoria
Corso HTML per l'editoria
 
HTML e CSS Prima Lezione
HTML e CSS Prima LezioneHTML e CSS Prima Lezione
HTML e CSS Prima Lezione
 
Presentazione Corso - Parte 1
Presentazione Corso - Parte 1Presentazione Corso - Parte 1
Presentazione Corso - Parte 1
 
Lab Web Prof.Di Blasi 2008
Lab Web Prof.Di Blasi 2008Lab Web Prof.Di Blasi 2008
Lab Web Prof.Di Blasi 2008
 
Lab Web Prof.Di Blasi 2008
Lab Web Prof.Di Blasi 2008Lab Web Prof.Di Blasi 2008
Lab Web Prof.Di Blasi 2008
 
Html e CSS ipertesti e siti web 4.5
Html e CSS   ipertesti e siti web 4.5Html e CSS   ipertesti e siti web 4.5
Html e CSS ipertesti e siti web 4.5
 
css
csscss
css
 
Css
CssCss
Css
 
Sviluppare estensioni per google chrome
Sviluppare estensioni per google chromeSviluppare estensioni per google chrome
Sviluppare estensioni per google chrome
 
Css1
Css1Css1
Css1
 
CSS corso base (classi seconde, mod 1)
CSS corso base (classi seconde, mod 1)CSS corso base (classi seconde, mod 1)
CSS corso base (classi seconde, mod 1)
 
Html
HtmlHtml
Html
 
Breve introduzione alle tecnologie HTML5 + (DOM) + CSS
Breve introduzione alle tecnologie HTML5 + (DOM) + CSS Breve introduzione alle tecnologie HTML5 + (DOM) + CSS
Breve introduzione alle tecnologie HTML5 + (DOM) + CSS
 
HTML (+ DOM) + CSS
HTML (+ DOM) + CSSHTML (+ DOM) + CSS
HTML (+ DOM) + CSS
 

Lezione 3

  • 1. Strumenti per il web design [ <a href=“#”> ]
  • 2. header content footer contenitore
  • 3. header content footer contenitore <!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;> <html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;> <head> <title>Titolo</title> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;stile.css&quot; /> </head> <body> <div id=&quot;contenitore&quot;> <div id=&quot;header&quot;></div> <div id=&quot;content&quot;> <p> Fa parlare i numeri <b>Antonio Martone</b>. E già la cifra, <br>oltre 4.000 proclamazioni in due anni, basta al <i>presidente della Commissione di garanzia</i> degli scioperi nei servizi pubblici essenziali, per condividere, con il governo, la necessità </p> </div> <div id=&quot;footer&quot;></div> </div> </body> </html> HTML
  • 4. header content footer contenitore CSS #content { width:850px; margin:auto; background:#fff; } #footer{ display:block; width:850px; height:100px; margin:auto; background:#F2A30F; } * { margin: 0px; padding: 0px; border: 0px; font-family: arial, helvetica, sans-serif; } body { background:#F5FFD8; } #contenitore { width: 900px; margin: auto; background: #cccccc; } #header{ width: 850px; height: 200px; margin: auto; background:#C4D929; }
  • 5. Colori http://kuler.adobe.com La 'tavolozza Web' è un insieme di 216 colori. Un PC dotato di scheda video a 256 colori può mostrare solo 216 colori fissi in modo affidabile e quando un browser non dispone di determinati colori, prova a &quot;crearli&quot;, mescolando pixel di colori. I l colore ottenuto è simile a quello non disponibile, ma non è il colore realmente impostato. Esiste però la possibilità di una codifica HTML diretta conoscendo il valore decimale di ciascun colore. Nel codice HTML ciascun valore è formato da sei cifre, precedute dal simbolo #: i colori del Web sono formati da tre coppie di cifre identiche, essendo tutte le cifre multiple di 3 (cioè 0, 3, 6, 9, C, F).
  • 6. Sfondo http://www.stripegenerator.com La scelta dello sfondo della nostra pagina Web è strettamente legata al tipo di progetto che stiamo realizzando. Lo sfondo può essere realizzato con una tinta unita oppure con dei gradienti di colore, oppure ancora con delle immagini che possono essere moltiplicate per tutta la grandezza dello sfondo