P. 1
guida_a_css

guida_a_css

Ratings: (0)|Views: 188 |Likes:
Published by Info_Writer

More info:

Published by: Info_Writer on Sep 23, 2009
Copyright:Attribution Non-commercial

Availability:

Read on Scribd mobile: iPhone, iPad and Android.
download as PDF, TXT or read online from Scribd
See more
See less

10/20/2011

pdf

text

original

 
1 di 6430/04/2006 16.55
Guida CSS di base
1.IntroduzioneCosa sono e a cosa servono i CSS. Guida alla consultazione della guida1.
I CSS e i documenti (X)HTML
2.Classificazione degli elementiCapire gli elementi di una pagina Web: elementi blocco, in linea e rimpiazzati, la struttura ad albero1.3.Inserire i fogli di stile in un documentoCome inserire i CSS in un documento: i link e l'oggetto @import2.4.L'attributo mediaDifferenziare i fogli di stile in base al dispositivo che li visualizzerà3.5.Fogli di stile alternativiLasciate decidere all'utente quale foglio di stile utilizzare per il documento4.6.CompatibilitàUn problema sempre aperto: la compatibilità tra i CSS e i browser5.
Le regole e la sintassi per scrivere i CSS
7.Come è fatto un CSS: regole e commentiLa struttura di un foglio di stile1.8.I selettoriLe fondamenta di un foglio di stile: i selettori2.9.Id e classi: due selettori specialiCome associare i fogli di stile alle parti di un documento3.10.Le pseudo-classiLe classi speciali: come definire lo stato di un elemento4.11.Gli Pseudo-elementiCreare al volo elementi fittizi non presenti nel codice del documento5.12.Le @-rulesLe funzioni e la sintassi di tutte le @-rules dei CSS6.
Unità di misura, ereditarietà e box model
13.Valori e unità di misuraTutti i valori e le unità di misura dei CSS: dalle dimensioni alle unità di tempo1.14.Ereditarietà, cascade, conflitti tra stiliCome i CSS gestiscono la priorità e la precedenza delle regole. il concetto di Cascade2.15.Il box modelCome i CSS gestiscono la visualizzazione degli elementi nella pagina3.
CSS all'opera: le proprietà di base
16.Gestione del coloreCambiare il colore agli elementi, ai bordi, allo sfondo di un elemento1.17.Gestione dello sfondoCome gestire lo sfondo di un documento con in CSS2.18.Gestione del testo: proprietà di baseLe proprietà base del testo: impostare il tipo di carattere, la grandezza, la formattazione3.19.Gestione del testo: proprietà avanzateLe proprietà avanzate del testo: rendere più leggibile una pagina, inserire l'ombreggiatura4.
Il Box Model: come disegnare la struttura della pagina
20.Gestione delle dimensioni: altezza1.
 
2 di 6430/04/2006 16.55
Definire l'altezza di un elemento: sintassi e valori21.Gestione delle dimensioni: larghezzaDefinire la larghezza di un elemento: sintassi e valori2.22.I MarginiCome spaziare i vari elementi tra loro: le cinque proprietà dell'elemento margin3.23.Il PaddingCreare spazi attorno agli elementi senza usare i margini4.24.I BordiDefinire lo stile, la grandezza, il colore e tutte le proprietà dei bordi di un elemento5.25.Le ListeGestire lo stile delle liste e associare un'immagine al segnaposto6.
Posizionare gli elementi nella pagina
26.tre proprietà speciali: display, float clearNascondere un elemento sulla pagina o posizionarlo in dipendenza di altri1.27.Posizionamento degli elementiPosizionare gli elementi in qualsiasi punto della pagina web2.28.Gestione della posizioneCome collocare con precisione gli elementi in una pagina Web3.
Altre proprietà
29.Agire sulle tabelleModifica dello stile delle tabelle: table-layout, border-collapse, border-spacing ecc.1.30.Altre proprietàLe proprietà cursor, content, direction, outline, quotes, unicode-bidi2.
Scegliere i CSS in base al supporto di visualizzazione
31.CSS per la stampa: paged media stylesLa formattazione delle pagine destinate alla stampa con i CSS1.32.CSS per documenti audio: aural media stylesControllare l'audio sui browser o su dispositivi vocali2.
Risorse utili
33.Tabelle di compatibilità, test, validazioneRisorse per testare e verificare la corretta sintassi dei CSS1.34.Gli Editor CSSI principali software per scrivere i CSS correttamente e con velocità2.35.Risorse on lineWebografia di siti utili dedicati ai CSS3.36.BibliografiaLibri in italiano e in inglese dedicati ai CSS4.
Introduzione
Dietro il semplice acronimo CSS (
Cascading Style Sheets - Fogli di stile a cascata
) si nasconde uno dei fondamentali linguaggistandard delW3C. La sua storia cammina su binari paralleli rispetto a quelli di HTML, di cui vuole essere l'ideale complemento. Dasempre infatti, nelle intenzioni degli uomini del Consortium, HTML, così come la sua recente evoluzione, XHTML, dovrebbe esserevisto semplicemente come un linguaggio
strutturale
, alieno da qualunque scopo attinente la
presentazione
di un documento. Perquesto obiettivo, ovvero arricchire l'aspetto visuale ed estetico di una pagina, lo strumento designato sono appunto i CSS. L'idealeperseguito da anni si può sintetizzare con una nota espressione: separare il contenuto dalla presentazione.
 
3 di 6430/04/2006 16.55
La prima specifica ufficiale di CSS (
CSS1
) risale al dicembre del 1996. Nel maggio 1998 è stata la volta della seconda versione:
CSS2
. Niente stravolgimenti, ma molte aggiunte rispetto alla prima.
CSS2
non è altro che
CSS1
più alcune nuove proprietà, valori diproprietà e definizioni per stili non canonici come quelli rivolti alla stampa o alla definizione di contenuti audio. E' attualmente allostato di Working Draft la nuova specifica
CSS3
.
A cosa servono
Inizio questa sezione con un'affermazione perentoria: se siete seriamente interessati alle tecnologie web non potete ignorare i CSS.Chi conosce un minimo di HTML è pienamente consapevole dei limiti di questo linguaggio sul lato della pura presentazione. A dire ilvero, non è giusto parlare di limiti: HTML non è nato per questo. E' stato però piegato a fare cose che intrinsecamente non era ingrado di fare. Bene: quasi tutto quello che con HTML non potete realizzare, riuscirete a farlo con i fogli di stile.Finalmente, ad esempio, potrete dare al testo delle vostre pagine un aspetto da word-processor: non solo con il
colore
o i
font
chepreferite, ma con un sistema di
interlinea
pratico e funzionale, con le
decorazioni
che desiderate, riuscendo a
spaziare
lettere eparole, impostando
stili diversi
per titoli e paragrafi, sfruttando i benefici dell'
indentatura
o della
giustificazione
.Ancora, potrete finalmente distanziare gli elementi della vostra pagina in maniera semplice e intuitiva con un potente meccanismo digestione dei
margini
. Tonnellate di gif trasparenti usate per spaziare possono essere finalmente gettate nel cestino del vostrocomputer. E se i margini non bastano sarete in grado ora di aggiungere bellisimi
bordi
non solo alle tabelle, ma a tutti gli elementi diuna pagina.Per non parlare degli
sfondi
: li potrete applicare a quello che volete. E dimenticate quelle brutte micro-textures. Finalmente potretesbattere su una pagina, magari ben piazzato al centro, quel vostro bellissimo disegno di 600x400 pixel senza doverlonecesseriamente vedere trasformato in orribili riquadri ripetuti sulla pagina.Ora siete voi a decidere come usare un'immagine disfondo: la potete ripetere in una sola direzione, in due o per niente! Facile e comodo.La cosa più bella è che la
gestione del sito
non sarà mai più un incubo. Se quel bellissimo disegno di prima vi stufa, non dovrete piùandare a modificare una per una 300 pagine! I CSS sono separati dal documento. Aprite un foglio di stile, cambiate l'immagine e ilgioco è fatto. Il risultato sono pagine più leggere e facili da modificare. Milioni di byte di banda risparmiati per la gioia degli utenti.Se poi avete a cuore l'accessibilità i CSS sono uno strumento portentoso, anche grazie al fatto di poter essere gestiti con linguaggi discripting avanzati in grado di modificare con un solo click l'aspetto di una pagina.Spero e credo che queste semplici considerazioni possano invogliarvi a procedere nella lettura di questa guida di base in cuitroverete la spiegazione di tutte le proprietà e dei meccanismi che regolano questo meraviglioso strumento. Quando avrete superato illivello di apprendistato non dimenticate di dare un'occhiata alla sezione PRO di HTML.it. Tanti articoli di approfondimento viaspettano per farvi sfruttare al meglio le potenzialità del linguaggio.
Guida alla consultazione
Un primo avviso: per una lettura consapevole della guida è richiesta una buona conoscenza di HTML e XHTML. In fini dei conti iCSS agiscono su questi linguaggi e non hanno alcun senso se separati da essi.La guida è suddivisa in tre parti:
1.
Nella prima affronteremo i concetti di base, ovvero i meccanismi e i costrutti che regolano il linguaggio e la sua interazione con(X)HTML.
2.
La seconda parte comprende l'elenco ragionato delle proprietà CSS2 suddivise per ambito di applicazione (sfondo, colore, testo,etc)
3.
Nella terza forniremo suggerimenti e proposte di approfondimento con bibliografia e webbografia.Quasi tutte le lezioni sono corredate di pagine di esempio. Esse non vanno considerate come un semplice matariale accessorio, masono
parte integrante e costitutiva
della guida. Contengono sempre note di commento ulteriore ed esempi di codice sugliargomenti trattati. Abbiamo anzi pensato di farvi un regalo. Le abbiamo raccolte, insieme ai CSS che ne definiscono lo stile, in un filezip. Scaricatele. Studiatevi comodamente il codice (X)HTML e quello dei fogli di stile. Giocateci un pò. Modificate le proprietà efate i vostri esperimenti. Vi assicuro che è il modo migliore per imparare.Scarica il file "
test.zip
".Nel proporre il riferimento alle proprietà ci siamo limitati all'esposizione della loro sintassi e del funzionamento di base. Non vengonoaffrontati in questa sede problemi di compatibilità o di bug di singoli browser nel trattamento di tali proprietà (salvo casi importanti).

Activity (12)

You've already reviewed this. Edit your review.
1 hundred reads
xagron liked this
mammanatale2001 liked this
diego liked this
m_devita952 liked this
tangostorm liked this
gsorren liked this

You're Reading a Free Preview

Download
scribd
/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->