CSS guida completa - terza edizione (CSS2 e CSS3)
Apogeo
- Volumi: 1
- Data Pubblicazione: 06/2011
- Lingua: italiano
- Livello: Introduttivo Intermedio
- Pagine: 274
- Collana: Guida completa
- Autore: Gianluca Troiani
Informazioni
Terza edizione del libro che insegna a utilizzare i CSS (Cascading Style Sheets, Fogli di Stile a Cascata) per sviluppare siti web usabili, accessibili, belli e, non meno importante, economici da gestire.
Le specifiche di riferimento sono l'ormai consolidata CSS2, affiancata dalle funzionalità di CSS3 oggi supportate dai più diffusi browser. I primi capitoli introducono i concetti che stanno alla base dei CSS illustrandone le regole e la relativa sintassi. Nella parte centrale l'autore espone le tecniche di sviluppo fondamentali per impaginare e definire i vari elementi di una pagina web.
Quindi si passa a tecniche avanzate che utilizzano il meglio di CSS2 e CSS3. Quello che emerge con forza è come i CSS permettano di esaltare la creatività dei web designer creando layout differenti e funzionali per qualsiasi dispositivo (mobile, smartphone e tablet, o desktop).
Il testo è caratterizzato da un approccio pratico che conduce dal problema alla soluzione, attraverso esempi di codice e immagini che facilitano la comprensione. Il codice degli esempi è disponibile e liberamente scaricabile online.
Argomenti in breve:
- Introduzione agli Standard W3C
- Regole CSS: i selettori, le proprietà, i valori
- Box-model e posizionamento degli elementi di blocco
- Formattazione di testo e sfondi
- Impaginazione a colonne: layout liquidi e fissi
- Definizione di menu dinamici e interattivi
- Fogli di stile per browser desktop, tablet, smartphone e per la stampa
- CSS e accessibilità
L'autore
Gianluca Troiani, laurea in Ingegneria Elettronica e web designer professionista, si interessa da anni all'applicazione degli standard W3C nello sviluppo web. Nei CSS ha trovato un potente strumento per definire l'aspetto delle pagine web, semplificare il lavoro dei web designer e migliorare l'esperienza di navigazione degli utenti. Dalla sua esperienza è nato il sito www.constile.org, oggi uno dei punti di riferimento per chi in Italia si interessa allo sviluppo con i Fogli di Stile a Cascata. Con Apogeo ha pubblicato anche CSS Pocket.
Indice generale
Introduzione .......................................................................................xiii
Capitolo 1 Gli standard e i CSS.........................................................1
Contenuti e formattazione: due oggetti distinti................................ 1
Le “zuppe di codice”.................................................................. 2
L’introduzione dei CSS.............................................................. 4
I vantaggi degli standard.................................................................. 4
La compatibilità......................................................................... 4
Indipendenza dal dispositivo...................................................... 4
L’accessibilità............................................................................. 5
Sviluppo e manutenzione.......................................................... 5
Leggerezza del codice................................................................ 5
Motori di ricerca....................................................................... 5
Standard come filosofia................................................................... 6
CSS................................................................................................ 6
Capitolo 2 Le regole CSS...................................................................7
Sintassi delle regole CSS................................................................. 7
I selettori........................................................................................ 8
Le proprietà CSS............................................................................ 9
I valori............................................................................................ 9
Associare i CSS ai documenti HTML............................................10
Fogli di stile incorporati............................................................10
Fogli di stile esterni...................................................................10
Fogli di stile importati...............................................................11
Stili alternativi..........................................................................11
Capitolo 3 I selettori CSS................................................................13
Selettore di tipo.............................................................................13
Selettore universale........................................................................14
Selettore di attributo......................................................................14
Selettori di attributo multipli....................................................15
Selettore class.................................................................................15
Selettore id....................................................................................16
Pseudoclassi...................................................................................17
Le pseudoclassi :link e :visited...................................................17
Le pseudoclassi dinamiche :hover, :focus e :active......................18
Pseudoclasse :lang.....................................................................19
Pseudoclassi :enabled e :disabled...............................................20
Pseudoclasse :checked...............................................................21
Pseudoclasse :nth-child()...........................................................21
Pseudoclasse :nth-last-child().....................................................22
Pseudoclasse :nth-of-type().......................................................23
Pseudoclasse :nth-last-of-type...................................................24
Pseudoclassi :first-child, :last-child e :only-child........................24
Pseudoclassi :first-of-type, :last-of-type e :only-of-type.............25
Pseudoclasse :empty..................................................................25
Pseudoclasse :not......................................................................26
Pseudo-elementi............................................................................26
Pseudo-elemento ::first-line......................................................26
Pseudo-elemento ::first-letter....................................................27
Pseudo-elementi ::before e ::after..............................................27
Combinatori..................................................................................28
Combinatore di discendenza.....................................................28
Combinatore figlio...................................................................28
Combinatore di adiacenza.........................................................29
Combinatore di precedenza......................................................29
Raggruppamento di selettori.........................................................29
Selettori e nuovi elementi HTML5................................................30
La cascata e la specificità dei selettori..............................................30
La direttiva !important...................................................................32
Estendere il supporto ai selettori di Internet Explorer versioni 7 e 8.........32
Capitolo 4 Tecniche di base: formattazione del testo..................33
Il tipo di carattere..........................................................................33
La dimensione del carattere............................................................37
La dimensione dei caratteri espressa mediante lunghezze...........37
La dimensione dei caratteri espressa mediante percentuali..........38
La dimensione dei caratteri espressa mediante parole chiave.......39
Lo stile del testo.............................................................................39
La proprietà font-style..............................................................39
La proprietà font-weight...........................................................39
Lo stile del testo e la regola @font-face.....................................40
Variazioni di formato.....................................................................41
L’interlinea.....................................................................................43
La proprietà font............................................................................43
La spaziatura del testo....................................................................44
Allineamento del testo...................................................................45
Indentazione del testo....................................................................46
Allineamento verticale del testo......................................................46
Decorazione del testo....................................................................48
Gli spazi bianchi............................................................................51
Ombre sul testo.............................................................................53
Capitolo 5 Tecniche di base: definizione dei colori e degli sfondi...........57
La definizione dei colori................................................................57
Il colore del testo e dello sfondo.....................................................59
Immagini di sfondo........................................................................62
Ripetizione dell’immagine di sfondo........................................62
La posizione dell’immagine di sfondo.......................................64
Scorrimento dell’immagine di sfondo.......................................66
La proprietà background...........................................................67
Sfondi multipli..........................................................................68
Capitolo 6 Tecniche di base: il box model.....................................73
I diversi tipi di elemento................................................................73
Elementi a livello di blocco (block level elements).....................73
Elementi in linea (inline-level elements)....................................73
Elementi rimpiazzati (replaced elements)...................................73
Le diverse proprietà che caratterizzano il box model.......................74
La proprietà width....................................................................74
La proprietà height...................................................................75
La proprietà padding.................................................................76
Le proprietà dei bordi...............................................................78
La proprietà margin..................................................................83
La proprietà overflow................................................................86
La proprietà box-shadow..........................................................92
Capitolo 7 Tecniche avanzate: impaginazione.............................97
Il posizionamento dei blocchi........................................................97
Il normale flusso.......................................................................98
Il posizionamento relativo.........................................................99
Il posizionamento assoluto......................................................102
Il posizionamento fisso............................................................105
Blocchi flottanti......................................................................107
Layout complessi..........................................................................115
Layout a larghezza fissa a due colonne.....................................115
Layout liquido a due colonne..................................................127
Layout a due colonne di cui una liquida e una a larghezza fissa.........136
Layout a larghezza fissa a tre colonne......................................141
Layout liquido a tre colonne...................................................147
Layout con tre colonne a larghezza fissa e una colonna liquida.......152
Oltre la terza colonna.............................................................157
Layout complessi....................................................................158
Griglie per l’impaginazione....................................................160
Tecniche emergenti................................................................169
Capitolo 8 Tecniche avanzate: menu di navigazione.................175
Menu a un solo livello.................................................................175
Codice HTML.......................................................................175
Menu verticali........................................................................176
Menu orizzontali....................................................................182
Menu a due livelli........................................................................191
Codice HTML.......................................................................191
I selettori................................................................................191
Menu verticale.......................................................................191
Menu orizzontale...................................................................193
Menu dinamico......................................................................195
Capitolo 9 Tecniche avanzate: immagini tramite CSS................201
Sfondi per il layout.......................................................................201
Box con angoli arrotondati..........................................................205
Sfondi come icone.......................................................................206
Sostituzione di testo con immagini...............................................208
Fahrner Image Replacement (FIR).........................................209
Leahy/Langridge Image Replacement (LIR)..........................211
Phark Image Replacement......................................................212
Accessibilità............................................................................214
Tecniche di sostituzione di immagini e collegamenti...............217
Capitolo 10 Tecniche avanzate: contenuti generati.....................227
Gli pseudo-elementi :before e :after.............................................227
La proprietà content....................................................................230
Valori per la proprietà content: le stringhe...............................230
Valori per la proprietà content: URL......................................231
Valori per la proprietà content: attributi..................................232
Valori per la proprietà content: contatori.................................233
Capitolo 11 Tecniche avanzate:
differenziare l’esperienza utente..............................235
Diversi media, diversi stili.............................................................235
Associazione dei fogli di stile a un medium specifico....................236
La regola @import.................................................................236
La regola @media...................................................................236
L’attributo media....................................................................237
Media query................................................................................237
Media feature.........................................................................237
Fogli di stile per la stampa............................................................243
Che cosa stampare..................................................................243
Colori e sfondi.......................................................................244
I caratteri................................................................................245
L’impaginazione.....................................................................245
Le interruzioni di pagina........................................................246
Una pagina, diversi stili................................................................246
Fogli di stile permanenti, preferiti e alternativi.........................246
Specificare fogli di stile permanenti.........................................247
Specificare fogli di stile preferiti..............................................247
Specificare fogli di stile alternativi...........................................247
Un esempio............................................................................248
Capitolo 12 Effetti speciali: trasformazioni e transizioni.............251
Trasformazioni.............................................................................251
scale().....................................................................................252
rotate()...................................................................................254
skew().....................................................................................255
translate()................................................................................256
Traformazioni multiple...........................................................257
transform-origin.....................................................................258
Transizioni...................................................................................259
Appendice A Accessibilità: Legge 04/2004 e CSS...........................263
Requisito n. 1..............................................................................264
Requisito n. 4..............................................................................264
Requisito n. 6..............................................................................264
Requisito n. 9..............................................................................266
Requisito n. 11............................................................................266
Requisito n. 12............................................................................266
Requisito n. 19............................................................................266
Oltre i requisiti............................................................................267
Nascondere i contenuti...........................................................267
Ordinamento dei contenuti....................................................267
Menu di navigazione a comparsa............................................267
Immagini introdotte tramite i CSS..........................................268
Contenuti generati.................................................................268
CSS specifici per migliorare l’accessibilità di una pagina..........268
Appendice B Partire da zero.............................................................269
Reset CSS di Eric Meyer.............................................................270
Uso dei file di reset......................................................................271
Indice analitico..................................................................................273
Carrello
(vuoto)
Offerte
-
-
Mobile Design progettare siti, webapp e app native
29,00 € (-15%) 24,65 €