Introduzione ai css

G
gianlucatroiani
••
INTRODUZIONE AI CSS COSA SONO E COME FUNZIONANO I CSS Licenza Creative Commons < http://creativecommons.org/licenses/by-nc-nd/3.0/ > Introduzione ai CSS by Gianluca Troiani is licensed under a Creative Commons Attribuzione - Non commerciale - Non opere derivate 3.0 Unported License. Based on a work at www.constile.org. Permissions beyond the scope of this license may be available at http://www.constile.org/res/introcss.html.
PRIMA PARTE INTRODUZIONE
INFORMAZIONE E PRESENTAZIONE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: INTRODUZIONE
BROWSER E STILI ,[object Object],[object Object],PRIMA PARTE: INTRODUZIONE
I FOGLI DI STILE A CASCATA (CSS) ,[object Object],[object Object],[object Object],PRIMA PARTE: INTRODUZIONE
PRIMA PARTE XHTML
STRUTTURA E CONTENUTI: L’XHTML ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: XHTML
DALL’HTML ALL’XHTML ,[object Object],[object Object],[object Object],PRIMA PARTE: XHTML Errato: <p>Paragrafo<p>Paragrafo <hr> <br> <p><em>enfasi</p></em> Corretto: <p>Paragrafo</p><p>Paragrafo</p> <hr /> <br /> <p><em>Enfasi</em></p>
DALL’HTML ALL’XHTML ,[object Object],[object Object],PRIMA PARTE: XHTML Errato: <P LANG=&quot;en&quot;>Paragraph</P> <a href=http://w3.org/> Corretto: <p lang=&quot;en&quot;>Paragraph</p> <a href=&quot;http://w3.org/&quot;> oppure <a href='http://w3.org/'>
DALL’HTML ALL’XHTML ,[object Object],[object Object],[object Object],PRIMA PARTE: XHTML
UNA STRUTTURA PER I CONTENUTI ,[object Object],[object Object],[object Object],PRIMA PARTE: XHTML
UNA STRUTTURA PER I CONTENUTI ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: XHTML
UNA STRUTTURA PER I CONTENUTI ,[object Object],[object Object],PRIMA PARTE: XHTML
UN DIVERSO APPROCCIO ,[object Object],[object Object],[object Object],PRIMA PARTE: XHTML
PRIMA PARTE STRUTTURA DI UN FOGLIO DI STILE
STRUTTURA DI UN FOGLIO DI STILE ,[object Object],[object Object],PRIMA PARTE: STRUTTURA DI UN FOGLIO DI STILE h1 { font-size : 2em; font-weight : bold; } DICHIARAZIONE PROPRIETÀ SELETTORE VALORE REGOLA
LE REGOLE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: STRUTTURA DI UN FOGLIO DI STILE
PRIMA PARTE I SELETTORI
I SELETTORI ,[object Object],[object Object],PRIMA PARTE: I SELETTORI h1, h2, p { ... } #identificatore { ... } .classe { ... } 1: TAG XHTML 3: IDENTIFICATORI 2: CLASSI
TIPI DI SELETTORI ,[object Object],PRIMA PARTE: I SELETTORI
LE CLASSI ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I SELETTORI
IDENTIFICATORI ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I SELETTORI
PSEUDO-CLASSI ,[object Object],PRIMA PARTE: I SELETTORI
PSEUDO-CLASSI ,[object Object],[object Object],PRIMA PARTE: I SELETTORI
PSEUDO-ELEMENTI ,[object Object],[object Object],PRIMA PARTE: I SELETTORI
DISCENDENZA ,[object Object],[object Object],PRIMA PARTE: I SELETTORI
DISCENDENZA ,[object Object],[object Object],PRIMA PARTE: I SELETTORI
SELETTORE FIGLIO ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I SELETTORI
SELETTORE FRATELLO ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I SELETTORI
SELETTORI DI ATTRIBUTO ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I SELETTORI
SELETTORI DI ATTRIBUTO ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I SELETTORI
SELETTORI DI ATTRIBUTO ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I SELETTORI
RAGGRUPPAMENTO DI SELETTORI ,[object Object],[object Object],[object Object],PRIMA PARTE: I SELETTORI
SPECIFICITÀ DEI SELETTORI ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I SELETTORI
SPECIFICITÀ DEI SELETTORI ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I SELETTORI
SPECIFICITÀ DEI SELETTORI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I SELETTORI
PRIMA PARTE COLLEGARE I CSS A UN DOCUMENTO XHTML
COLLEGARE I CSS A UN DOCUMENTO XHTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: COLLEGARE I CSS A UN DOCUMENTO XHTML
FOGLI DI STILE INCORPORATI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: COLLEGARE I CSS A UN DOCUMENTO XHTML
FOGLI DI STILE ESTERNI ,[object Object],[object Object],PRIMA PARTE: COLLEGARE I CSS A UN DOCUMENTO XHTML
FOGLI DI STILE IMPORTATI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: COLLEGARE I CSS A UN DOCUMENTO XHTML
PRIMA PARTE I VALORI
PAROLE CHIAVE: INHERIT ,[object Object],[object Object],PRIMA PARTE: I VALORI
PAROLE CHIAVE: AUTO ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I VALORI
PAROLE CHIAVE: DIMENSIONE CARATTERI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I VALORI
LUNGHEZZE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I VALORI
LE PERCENTUALI ,[object Object],[object Object],[object Object],PRIMA PARTE: I VALORI
RIFERIMENTI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I VALORI
COLORI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: I VALORI
PRIMA PARTE IL BOX MODEL
IL BOX MODEL ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
IL BOX MODEL ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
IL BOX MODEL ,[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
LARGHEZZA E ALTEZZA ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
LARGHEZZA E ALTEZZA ,[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
LARGHEZZA E ALTEZZA ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
I MARGINI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
I MARGINI ,[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
I MARGINI ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
I MARGINI ,[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
I MARGINI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL I margini di blocchi flottanti o dei blocchi posizionati in modo assoluto, non collassano in nessun caso.
IL PADDING ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
I BORDI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
I BORDI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
I BORDI ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
OVERFLOW ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
OVERFLOW: VISIBLE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
OVERFLOW: HIDDEN ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
OVERFLOW: SCROLL E AUTO ,[object Object],[object Object],[object Object],PRIMA PARTE: IL BOX MODEL
PRIMA PARTE IL VISUAL FORMATTING MODEL
IL VISUAL FORMATTING MODEL ,[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
TIPI DI BOX ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
TIPI DI BOX ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX ANONIMI ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
IL FLUSSO ,[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL p { border:1px solid #00C; } em{ margin:2em;border:1px solid #C00 } strong { border:1px solid #0C0; padding:0.7em; }
IL FLUSSO ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL p#lh{ line-height:2em; } strong{ line-height:1em; vertical-align:top; } p#va { /* uso errato */ height:5em; vertical-align:bottom; }
POSIZIONAMENTO RELATIVO ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL p#pr { position:relative; left:1em;top:1.5em; } p { padding:0.5em;margin:1em }
POSIZIONAMENTO ASSOLUTO ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
POSIZIONAMENTO ASSOLUTO ,[object Object],[object Object],<p>(1) …</p> <p id=&quot;pa&quot;>(2) …</p> <p>(3) …</p> p#pa { position:absolute; right:5px; bottom:5px; margin:0; } p { margin:1em 10px; } PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ,[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ,[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ,[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ,[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
IL VISUAL FORMATTING MODEL: BOX FLOTTANTI ,[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL p#fl { float:left; width:200px; } div { padding: 1em }
BOX FLOTTANTI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
IL VISUAL FORMATTING MODEL: BOX FLOTTANTI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ALTRI DIFETTI DI INTERNET EXPLORER PER WINDOWS ,[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ALTRI DIFETTI DI INTERNET EXPLORER PER WINDOWS ,[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ALTRI DIFETTI DI INTERNET EXPLORER PER WINDOWS ,[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ALTRI DIFETTI DI INTERNET EXPLORER PER WINDOWS ,[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ALTRI DIFETTI DI INTERNET EXPLORER PER WINDOWS ,[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ALTRI DIFETTI DI INTERNET EXPLORER PER WINDOWS ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI ALTRI DIFETTI DI INTERNET EXPLORER PER WINDOWS ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI E LISTE ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI E LISTE ,[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
BOX FLOTTANTI E LISTE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: IL VISUAL FORMATTING MODEL
VISIBILITY ,[object Object],[object Object],[object Object],[object Object],[object Object],Al paragrafo è stata assegnata la dichiarazione visibility:hidden PRIMA PARTE: IL VISUAL FORMATTING MODEL
PRIMA PARTE CONTENUTI GENERATI
CONTENUTI GENERATI ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CONTENUTI GENERATI
CONTENUTI GENERATI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CONTENUTI GENERATI
CONTENUTI GENERATI ,[object Object],[object Object],[object Object],PRIMA PARTE: CONTENUTI GENERATI
PRIMA PARTE COLORI E SFONDI
COLORE IN PRIMO PIANO (TESTO E BORDI) ,[object Object],[object Object],[object Object],PRIMA PARTE: COLORI E SFONDI
SFONDI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: COLORI E SFONDI
COLORE DELLO SFONDO ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: COLORI E SFONDI
COLORI DI TESTO E SFONDO DEFINITI SEPARATAMENTE ,[object Object],[object Object],PRIMA PARTE: COLORI E SFONDI
BACKGROUND-IMAGE ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: COLORI E SFONDI
BACKGROUND-REPEAT ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: COLORI E SFONDI
BACKGROUND-ATTACHEMENT ,[object Object],[object Object],[object Object],PRIMA PARTE: COLORI E SFONDI
BACKGROUND-POSITION ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: COLORI E SFONDI
BACKGROUND-POSITION ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: COLORI E SFONDI
BACKGROUND-POSITION PRIMA PARTE: COLORI E SFONDI background-position : 20% 25%;
BACKGROUND ,[object Object],[object Object],[object Object],PRIMA PARTE: COLORI E SFONDI
PRIMA PARTE CARATTERI E TESTO
CARATTERI E TESTO ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CARATTERI E TESTO
FONT-FAMILY ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CARATTERI E TESTO
FONT-SIZE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CARATTERI E TESTO
FONT-STILE, FONT-WEIGHT, FONT-VARIANT ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CARATTERI E TESTO
FONT ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CARATTERI E TESTO
ALLINEAMENTO DEL TESTO ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CARATTERI E TESTO
DECORAZIONE DEL TESTO ,[object Object],[object Object],[object Object],PRIMA PARTE: CARATTERI E TESTO
SPAZIATURA FRA PAROLE E CARATTERI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CARATTERI E TESTO
CARATTERI BIANCHI E INTERRUZIONI DI LINEA ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CARATTERI E TESTO
CARATTERI BIANCHI E INTERRUZIONI DI LINEA ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CARATTERI E TESTO
TRASFORMAZIONI DEL CARATTERE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: CARATTERI E TESTO
PRIMA PARTE FORMATTAZIONE DELLE TABELLE
FORMATTAZIONE DELLE TABELLE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: FORMATTAZIONE DELLE TABELLE
BORDER-COLLAPSE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: FORMATTAZIONE DELLE TABELLE
RIGHE E COLONNE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: FORMATTAZIONE DELLE TABELLE
INTESTAZIONE E RIGHE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: FORMATTAZIONE DELLE TABELLE <table summary=&quot;...&quot;> <thead><tr><th>…</th>…</tr></thead> <tbody> <tr class=&quot;d&quot;><td>…</td>…</tr> <tr class=&quot;p&quot;><td>…</td>…</tr> <tr class=&quot;d&quot;><td>…</td>…</tr> <tr class=&quot;p&quot;><td>…</td>…</tr> </tbody> </table>
SPAZIO FRA CELLE ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: FORMATTAZIONE DELLE TABELLE
PRIMA PARTE INTERFACCIA UTENTE
INTERFACCIA UTENTE ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: INTERFACCIA UTENTE
PUNTATORE ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: INTERFACCIA UTENTE
COLORI E SFONDI ,[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: INTERFACCIA UTENTE
CARATTERI ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: INTERFACCIA UTENTE
PRIMA PARTE MEDIA ALTERNATIVI
MEDIA ALTERNATIVI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: MEDIA ALTERNATIVI
MEDIA ALTERNATIVI ,[object Object],[object Object],[object Object],[object Object],[object Object],PRIMA PARTE: MEDIA ALTERNATIVI
PRIMA PARTE FINE PRIMA PARTE
SECONDA PARTE CORREGGERE IL BOX MODEL DI INTERNET EXPLORER 5.x PER WINDOWS
IL PROBLEMA ,[object Object],[object Object],SECONDA PARTE: CORREGGERE IL BOX MODEL DI INTERNET EXPLORER 5.x PER WINDOWS
LE SOLUZIONI ,[object Object],[object Object],[object Object],SECONDA PARTE: CORREGGERE IL BOX MODEL DI INTERNET EXPLORER 5.x PER WINDOWS
SECONDA PARTE LAYOUT A LARGHEZZA FISSA A 3 COLONNE CON BOX FLOTTANTI
STRUTTURA DELLA PAGINA ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT A LARGHEZZA FISSA A 3 COLONNE CON BOX FLOTTANTI
LE TRE COLONNE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT A LARGHEZZA FISSA A 3 COLONNE CON BOX FLOTTANTI width:100% corregge un baco di Internet Explorer
SFONDO DELLE COLONNE ,[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT A LARGHEZZA FISSA A 3 COLONNE CON BOX FLOTTANTI
SFONDO DELLE COLONNE ,[object Object],SECONDA PARTE: LAYOUT A LARGHEZZA FISSA A 3 COLONNE CON BOX FLOTTANTI
SFONDO DELLE COLONNE ,[object Object],SECONDA PARTE: LAYOUT A LARGHEZZA FISSA A 3 COLONNE CON BOX FLOTTANTI
SPAZIO FRA LE COLONNE ,[object Object],[object Object],#c1 p, #c2 p, #c3 p, #piede p { margin:0; padding:0.5em 1em; } #c1, #c2, #c3, #piede { padding:0.5em 0; } h1 { font-size:1.2em; margin:0; padding:1em } SECONDA PARTE: LAYOUT A LARGHEZZA FISSA A 3 COLONNE CON BOX FLOTTANTI
POSIZIONE DELLE COLONNE ,[object Object],[object Object],SECONDA PARTE: LAYOUT A LARGHEZZA FISSA A 3 COLONNE CON BOX FLOTTANTI #c2 { position:relative; left:200px; } #c3 { position:relative; left:-300px; }
SECONDA PARTE LAYOUT LIQUIDO A 3 COLONNE CON BOX FLOTTANTI
STRUTTURA DELLA PAGINA ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A 3 COLONNE CON BOX FLOTTANTI
LE TRE COLONNE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A 3 COLONNE CON BOX FLOTTANTI
LE TRE COLONNE ,[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A 3 COLONNE CON BOX FLOTTANTI
LE TRE COLONNE ,[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A 3 COLONNE CON BOX FLOTTANTI
LE TRE COLONNE ,[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A 3 COLONNE CON BOX FLOTTANTI
SFONDO DELLE COLONNE ,[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A 3 COLONNE CON BOX FLOTTANTI
SFONDO DELLE COLONNE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A 3 COLONNE CON BOX FLOTTANTI
SFONDO DELLE COLONNE ,[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A 3 COLONNE CON BOX FLOTTANTI
SPAZIO FRA LE COLONNE ,[object Object],SECONDA PARTE: LAYOUT LIQUIDO A 3 COLONNE CON BOX FLOTTANTI #piede { background:#CCC; } #testa { background:#CCC; } h1 { font-size:1.2em; margin:0; padding:1em } #c1 p, #c2 p, #c3 p { margin:0; padding:0.5em 0; } #piede p { margin:0; padding:0.5em 1em; } #c1, #c2, #c3, #piede { padding:0.5em 0; }
SECONDA PARTE LAYOUT LIQUIDO A COLONNE CON BOX POSIZIONATI IN MODO ASSOLUTO
LAYOUT A COLONNE CON BOX POSIZIONATI IN MODO ASSOLUTO ,[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A COLONNE CON BOX POSIZIONATI IN MODO ASSOLUTO
LAYOUT A COLONNE CON BOX POSIZIONATI IN MODO ASSOLUTO ,[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A COLONNE CON BOX POSIZIONATI IN MODO ASSOLUTO
LAYOUT A COLONNE CON BOX POSIZIONATI IN MODO ASSOLUTO ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A COLONNE CON BOX POSIZIONATI IN MODO ASSOLUTO
LE TRE COLONNE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A COLONNE CON BOX POSIZIONATI IN MODO ASSOLUTO
LE TRE COLONNE ,[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A COLONNE CON BOX POSIZIONATI IN MODO ASSOLUTO
LE TRE COLONNE ,[object Object],[object Object],SECONDA PARTE: LAYOUT LIQUIDO A COLONNE CON BOX POSIZIONATI IN MODO ASSOLUTO #c1{ border-right:1px dotted #900; } #c2{ border-right:1px dotted #900; }
SECONDA PARTE CENTRARE UN BOX NELLA PAGINA
CENTRARE UN BOX NELLA PAGINA ,[object Object],[object Object],[object Object],SECONDA PARTE: CENTRARE UN BOX NELLA PAGINA
CENTRARE UN BOX NELLA PAGINA ,[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: CENTRARE UN BOX NELLA PAGINA
CENTRARE UN BOX NELLA PAGINA ,[object Object],[object Object],SECONDA PARTE: CENTRARE UN BOX NELLA PAGINA
SECONDA PARTE FORMATTARE LE LISTE DI LINK  MENU
FORMATTARE LE LISTE DI LINK  MENU ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU
FORMATTARE LE LISTE DI LINK  MENU ,[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU
FORMATTARE LE LISTE DI LINK  MENU ,[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU
MENU VERTICALI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU
MENU VERTICALI: ICONA AL PASSAGGIO DEL MOUSE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU
MENU VERTICALI: ICONA AL PASSAGGIO DEL MOUSE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU
MENU VERTICALI: EFFETTO PULSANTE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU click*
MENU VERTICALI: EFFETTO PULSANTE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU
MENU ORIZZONTALE ,[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU
MENU ORIZZONTALE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU
MENU ORIZZONTALE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU
MENU ORIZZONTALE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU
MENU ORIZZONTALE ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],SECONDA PARTE: FORMATTARE LE LISTE DI LINK  MENU class=&quot;on&quot;
MENU ORIZZONTALE ,[object Object]
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
Introduzione ai css
1 of 231

Introduzione ai css

••
Download to read offline
Education

COSA SONO E COME FUNZIONANO I CSS Rielaborazione delle slide utilizzate nei miei vecchi seminari sui CSS. Licenza Creative Commons &lt; http://creativecommons.org/licenses/by-nc-nd/3.0/ > Introduzione ai CSS by Gianluca Troiani is licensed under a Creative Commons Attribuzione - Non commerciale - Non opere derivate 3.0 Unported License. Based on a work at www.constile.org. Permissions beyond the scope of this license may be available at http://www.constile.org/res/introcss.html.

G
gianlucatroiani

Recommended

CSS corso base (classi seconde, mod 1) by
CSS corso base (classi seconde, mod 1)CSS corso base (classi seconde, mod 1)
CSS corso base (classi seconde, mod 1)Matteo Ziviani
741 views•56 slides
Corso di HTML5 e CSS by
Corso di HTML5 e CSSCorso di HTML5 e CSS
Corso di HTML5 e CSSSalvatore Cordiano
1.6K views•29 slides
Guida introduttiva al css by
Guida introduttiva al cssGuida introduttiva al css
Guida introduttiva al cssEnrico Mainero
779 views•30 slides
HTML e CSS by
HTML e CSSHTML e CSS
HTML e CSSManuel Scapolan
1.9K views•44 slides
Introduzione al CSS by
Introduzione al CSSIntroduzione al CSS
Introduzione al CSSPaolo Quartarone
850 views•20 slides
HTMLslide html by
HTMLslide htmlHTMLslide html
HTMLslide htmlritalerede
1.3K views•58 slides

More Related Content

What's hot

Struttura di una pagina html by
Struttura di una pagina htmlStruttura di una pagina html
Struttura di una pagina htmlEnrico Mainero
761 views•38 slides
Html5 e css3 nuovi strumenti per un nuovo web by
Html5 e css3 nuovi strumenti per un nuovo webHtml5 e css3 nuovi strumenti per un nuovo web
Html5 e css3 nuovi strumenti per un nuovo webMassimo Bonanni
1.7K views•64 slides
Introduction to HTML by
Introduction to HTMLIntroduction to HTML
Introduction to HTMLRoberto Dadda
1.5K views•62 slides
Html5 by
Html5Html5
Html5Salvatore Paone
2.4K views•86 slides
Html Base by
Html BaseHtml Base
Html Baseandreainfussi
1.3K views•79 slides
Guida introduttiva al codice HTML by
Guida introduttiva al codice HTMLGuida introduttiva al codice HTML
Guida introduttiva al codice HTMLEnrico Mainero
863 views•33 slides

What's hot(20)

Struttura di una pagina html by Enrico Mainero
Struttura di una pagina htmlStruttura di una pagina html
Struttura di una pagina html
Enrico Mainero•761 views
Html5 e css3 nuovi strumenti per un nuovo web by Massimo Bonanni
Html5 e css3 nuovi strumenti per un nuovo webHtml5 e css3 nuovi strumenti per un nuovo web
Html5 e css3 nuovi strumenti per un nuovo web
Massimo Bonanni•1.7K views
Introduction to HTML by Roberto Dadda
Introduction to HTMLIntroduction to HTML
Introduction to HTML
Roberto Dadda•1.5K views
Html5 by Salvatore Paone
Html5Html5
Html5
Salvatore Paone•2.4K views
Html Base by andreainfussi
Html BaseHtml Base
Html Base
andreainfussi•1.3K views
Guida introduttiva al codice HTML by Enrico Mainero
Guida introduttiva al codice HTMLGuida introduttiva al codice HTML
Guida introduttiva al codice HTML
Enrico Mainero•863 views
HTML5 by Raffaele Fanizzi
HTML5HTML5
HTML5
Raffaele Fanizzi•597 views
Html 5: una breve guida! by Enrico Mainero
Html 5: una breve guida!Html 5: una breve guida!
Html 5: una breve guida!
Enrico Mainero•707 views
HTML5 Italy: Mai più CSS, fogli di stile moderni con LESS - Salvatore Romeo by marcocasario
HTML5 Italy: Mai più CSS, fogli di stile moderni con LESS - Salvatore RomeoHTML5 Italy: Mai più CSS, fogli di stile moderni con LESS - Salvatore Romeo
HTML5 Italy: Mai più CSS, fogli di stile moderni con LESS - Salvatore Romeo
marcocasario•3.1K views
Lezione HTML by Mariella Consoli
Lezione HTMLLezione HTML
Lezione HTML
Mariella Consoli•1.6K views
Fogli di stile CSS by Daniele Moraschi
Fogli di stile CSSFogli di stile CSS
Fogli di stile CSS
Daniele Moraschi•1.4K views
Html5 - classi prime - multimedia by Matteo Ziviani
Html5 - classi prime - multimediaHtml5 - classi prime - multimedia
Html5 - classi prime - multimedia
Matteo Ziviani•48 views
Html base - classi prime - multimedia by Matteo Ziviani
Html base - classi prime - multimediaHtml base - classi prime - multimedia
Html base - classi prime - multimedia
Matteo Ziviani•191 views
Corso HTML per l'editoria by Diego La Monica
Corso HTML per l'editoriaCorso HTML per l'editoria
Corso HTML per l'editoria
Diego La Monica•295 views
Presentazione Corso - Parte 1 by Giorgio Carpoca
Presentazione Corso - Parte 1Presentazione Corso - Parte 1
Presentazione Corso - Parte 1
Giorgio Carpoca•326 views
Open web programming by nois3lab
Open web programmingOpen web programming
Open web programming
nois3lab•393 views
Introduzione all'Html by Daniele Moraschi
Introduzione all'HtmlIntroduzione all'Html
Introduzione all'Html
Daniele Moraschi•868 views
Ancora anatomia, le pagine HTML(5) by nois3lab
Ancora anatomia, le pagine HTML(5)Ancora anatomia, le pagine HTML(5)
Ancora anatomia, le pagine HTML(5)
nois3lab•707 views
I Linguaggi Del Web (1° Giornata) by Diego La Monica
I Linguaggi Del Web (1° Giornata)I Linguaggi Del Web (1° Giornata)
I Linguaggi Del Web (1° Giornata)
Diego La Monica•382 views
Html TAGS 2 by Scuola Media Galileo Galilei Mira
Html TAGS 2Html TAGS 2
Html TAGS 2
Scuola Media Galileo Galilei Mira•533 views

Viewers also liked

Art Weekly Report_2 dicembre 2013 by
Art Weekly Report_2 dicembre 2013Art Weekly Report_2 dicembre 2013
Art Weekly Report_2 dicembre 2013Maurizio Nicosia
2.6K views•34 slides
Archivio48 by
Archivio48Archivio48
Archivio48Roberto Rapaccini
748 views•98 slides
Ebook crescita investimenti e territorio by
Ebook crescita investimenti e territorioEbook crescita investimenti e territorio
Ebook crescita investimenti e territorioRiccardo Cappellin
938 views•274 slides
Il suono nel maglio: racconti di un artigiano diventato imprenditore by
Il suono nel maglio: racconti di un artigiano diventato imprenditoreIl suono nel maglio: racconti di un artigiano diventato imprenditore
Il suono nel maglio: racconti di un artigiano diventato imprenditoreValentina Durante
506 views•19 slides
New living experience: nuove tendenze nell'abitare by
New living experience: nuove tendenze nell'abitareNew living experience: nuove tendenze nell'abitare
New living experience: nuove tendenze nell'abitareValentina Durante
1.2K views•266 slides
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 2 by
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 2Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 2
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 2Valentina Durante
823 views•30 slides

Viewers also liked(20)

Art Weekly Report_2 dicembre 2013 by Maurizio Nicosia
Art Weekly Report_2 dicembre 2013Art Weekly Report_2 dicembre 2013
Art Weekly Report_2 dicembre 2013
Maurizio Nicosia•2.6K views
Archivio48 by Roberto Rapaccini
Archivio48Archivio48
Archivio48
Roberto Rapaccini•748 views
Ebook crescita investimenti e territorio by Riccardo Cappellin
Ebook crescita investimenti e territorioEbook crescita investimenti e territorio
Ebook crescita investimenti e territorio
Riccardo Cappellin•938 views
Il suono nel maglio: racconti di un artigiano diventato imprenditore by Valentina Durante
Il suono nel maglio: racconti di un artigiano diventato imprenditoreIl suono nel maglio: racconti di un artigiano diventato imprenditore
Il suono nel maglio: racconti di un artigiano diventato imprenditore
Valentina Durante•506 views
New living experience: nuove tendenze nell'abitare by Valentina Durante
New living experience: nuove tendenze nell'abitareNew living experience: nuove tendenze nell'abitare
New living experience: nuove tendenze nell'abitare
Valentina Durante•1.2K views
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 2 by Valentina Durante
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 2Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 2
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 2
Valentina Durante•823 views
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Introduzione by Valentina Durante
Tendenze, moodboard, prodotti (e non possono mancare le storie) – IntroduzioneTendenze, moodboard, prodotti (e non possono mancare le storie) – Introduzione
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Introduzione
Valentina Durante•1.6K views
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 4 by Valentina Durante
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 4Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 4
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 4
Valentina Durante•835 views
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 3 by Valentina Durante
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 3Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 3
Tendenze, moodboard, prodotti (e non possono mancare le storie) – Tema 3
Valentina Durante•1.1K views
Prevision(17): codici culturali, neuromarketing e marketing religioso by Valentina Durante
Prevision(17): codici culturali, neuromarketing e marketing religiosoPrevision(17): codici culturali, neuromarketing e marketing religioso
Prevision(17): codici culturali, neuromarketing e marketing religioso
Valentina Durante•2.1K views
Brasile manuale operativo 2012 by stefano salardi
Brasile manuale operativo 2012Brasile manuale operativo 2012
Brasile manuale operativo 2012
stefano salardi•12.3K views
Florencia by F. Ovies
Florencia Florencia
Florencia
F. Ovies•347 views
Pint esc xv_xvii by felipperez
Pint esc xv_xviiPint esc xv_xvii
Pint esc xv_xvii
felipperez•254 views
Opere by Maruzells zells
OpereOpere
Opere
Maruzells zells•658 views
Crea il tuo e-commerce internazionale: the Global Action Plan by Andrea Vit
Crea il tuo e-commerce internazionale: the Global Action PlanCrea il tuo e-commerce internazionale: the Global Action Plan
Crea il tuo e-commerce internazionale: the Global Action Plan
Andrea Vit•2.2K views
Html e Css - 3 | WebMaster & WebDesigner by Matteo Magni
Html e Css - 3 | WebMaster & WebDesignerHtml e Css - 3 | WebMaster & WebDesigner
Html e Css - 3 | WebMaster & WebDesigner
Matteo Magni•574 views
Wireframe e struttura del sito internet by Daniele Moraschi
Wireframe e struttura del sito internetWireframe e struttura del sito internet
Wireframe e struttura del sito internet
Daniele Moraschi•1.3K views
Xhtml by Manav Prasad
XhtmlXhtml
Xhtml
Manav Prasad•2.5K views
Concetti teorico-clinici: stadi evolutivi del disegno infantile by Nunzia Tarantini
Concetti teorico-clinici: stadi evolutivi del disegno infantileConcetti teorico-clinici: stadi evolutivi del disegno infantile
Concetti teorico-clinici: stadi evolutivi del disegno infantile
Nunzia Tarantini•9.9K views
03 lezioni di-tecniche-dosservazione-del-comportamento-infan.2moduli by iva martini
03 lezioni di-tecniche-dosservazione-del-comportamento-infan.2moduli03 lezioni di-tecniche-dosservazione-del-comportamento-infan.2moduli
03 lezioni di-tecniche-dosservazione-del-comportamento-infan.2moduli
iva martini•1.6K views

Similar to Introduzione ai css

Breve introduzione alle tecnologie HTML5 + (DOM) + CSS by
Breve introduzione alle tecnologie HTML5 + (DOM) + CSS Breve introduzione alle tecnologie HTML5 + (DOM) + CSS
Breve introduzione alle tecnologie HTML5 + (DOM) + CSS Giuseppe Vizzari
1.5K views•31 slides
HTML (+ DOM) + CSS by
HTML (+ DOM) + CSSHTML (+ DOM) + CSS
HTML (+ DOM) + CSSGiuseppe Vizzari
1.5K views•34 slides
Lezione HTML by
Lezione HTMLLezione HTML
Lezione HTMLMariella Consoli
1.7K views•47 slides
Web writing 2 by
Web writing 2Web writing 2
Web writing 2icferrucci
363 views•8 slides
Xml Xslt by
Xml XsltXml Xslt
Xml XsltDomenico Briganti
1.6K views•124 slides
Html e Css - 2 | WebMaster & WebDesigner by
Html e Css - 2 | WebMaster & WebDesignerHtml e Css - 2 | WebMaster & WebDesigner
Html e Css - 2 | WebMaster & WebDesignerMatteo Magni
1.2K views•33 slides

Similar to Introduzione ai css(20)

Breve introduzione alle tecnologie HTML5 + (DOM) + CSS by Giuseppe Vizzari
Breve introduzione alle tecnologie HTML5 + (DOM) + CSS Breve introduzione alle tecnologie HTML5 + (DOM) + CSS
Breve introduzione alle tecnologie HTML5 + (DOM) + CSS
Giuseppe Vizzari•1.5K views
HTML (+ DOM) + CSS by Giuseppe Vizzari
HTML (+ DOM) + CSSHTML (+ DOM) + CSS
HTML (+ DOM) + CSS
Giuseppe Vizzari•1.5K views
Lezione HTML by Mariella Consoli
Lezione HTMLLezione HTML
Lezione HTML
Mariella Consoli•1.7K views
Web writing 2 by icferrucci
Web writing 2Web writing 2
Web writing 2
icferrucci•363 views
Xml Xslt by Domenico Briganti
Xml XsltXml Xslt
Xml Xslt
Domenico Briganti•1.6K views
Html e Css - 2 | WebMaster & WebDesigner by Matteo Magni
Html e Css - 2 | WebMaster & WebDesignerHtml e Css - 2 | WebMaster & WebDesigner
Html e Css - 2 | WebMaster & WebDesigner
Matteo Magni•1.2K views
Html e Css - 2 | WebMaster & WebDesigner by Matteo Magni
Html e Css - 2 | WebMaster & WebDesigner Html e Css - 2 | WebMaster & WebDesigner
Html e Css - 2 | WebMaster & WebDesigner
Matteo Magni•266 views
CSS - Box Model by Giovanni Buffa
CSS - Box ModelCSS - Box Model
CSS - Box Model
Giovanni Buffa•448 views
Dal Click Al Web Server by Marco Muzzarelli
Dal Click Al Web ServerDal Click Al Web Server
Dal Click Al Web Server
Marco Muzzarelli•614 views
Html e Css - 1 | WebMaster & WebDesigner by Matteo Magni
Html e Css - 1 | WebMaster & WebDesigner Html e Css - 1 | WebMaster & WebDesigner
Html e Css - 1 | WebMaster & WebDesigner
Matteo Magni•430 views
Html e Css - 3 | WebMaster & WebDesigner by Matteo Magni
Html e Css - 3 | WebMaster & WebDesignerHtml e Css - 3 | WebMaster & WebDesigner
Html e Css - 3 | WebMaster & WebDesigner
Matteo Magni•619 views
Css1 by carstefani
Css1Css1
Css1
carstefani•347 views
Html e Css - 1 | WebMaster & WebDesigner by Matteo Magni
Html e Css - 1 | WebMaster & WebDesignerHtml e Css - 1 | WebMaster & WebDesigner
Html e Css - 1 | WebMaster & WebDesigner
Matteo Magni•811 views
•Blog: quali tecnologie per il futuro? by IWA
•Blog: quali tecnologie per il futuro?•Blog: quali tecnologie per il futuro?
•Blog: quali tecnologie per il futuro?
IWA•358 views
HTMLslide by ritalerede
HTMLslide HTMLslide
HTMLslide
ritalerede•568 views
Web base-01-html by Studiabo
Web base-01-htmlWeb base-01-html
Web base-01-html
Studiabo•174 views
Presentazione wicket by Andrea Del Bene
Presentazione wicketPresentazione wicket
Presentazione wicket
Andrea Del Bene•1.1K views
Lezione 5 - L'HTML by Giuseppe Cramarossa
Lezione 5 - L'HTMLLezione 5 - L'HTML
Lezione 5 - L'HTML
Giuseppe Cramarossa•111 views
Presentazione Xml by tave10
Presentazione XmlPresentazione Xml
Presentazione Xml
tave10•1.2K views
HTML5 e Css3 - 1 | WebMaster & WebDesigner by Matteo Magni
HTML5 e Css3 - 1 | WebMaster & WebDesignerHTML5 e Css3 - 1 | WebMaster & WebDesigner
HTML5 e Css3 - 1 | WebMaster & WebDesigner
Matteo Magni•810 views

Introduzione ai css

Editor's Notes

  1. Con programma utente si intende la traduzione, suggerita da Michele Diodati, dello USER AGENT.
  2. L’XHTML è anche il linguaggio che, per il W3C, ha sostituito l’HTML per cui è bene abbracciare totalmente gli standard e non solo in parte (CSS+HTML)
  3. La centratura ha significato solo se il box ha una larghezza specificata I margini superiore e inferiore dei paragrafi sono generalmente pari a 1em, i div hanno margine nullo
  4. Vedremo più avanti il significato di box flottante e box posizionato
  5. Vedremo più avanti il significato di box flottante e box posizionato
  6. Si consideri la sovrapposizione degli effetti per cui è possibile definire alcuni aspetti globalmente e altri in modo specifico