Utente:Sassospicco/bozza CSS: differenze tra le versioni

Versione delle 15:20, 28 apr 2006

Versione delle 15:57, 28 apr 2006

Riga 1:

{{Utente:Sassospicco/Template:bozza}}

I '''fogli di stile a cascata''' (dall'inglese '''CSS''' ''Cascading Style Sheet'') sono il linguaggio definito dal [[W3C]] (''World Wide Web Consortium'') per '''definire l'aspetto''' delle [[pagine web]]. I fogli di stile sono applicati soprattutto a pagine scritte in [[HTML]] e [[XHTML]], tuttavia si prestano a qualsiasi file [[XML]], compresi [[SVG]] e [[XUL]]. La loro creazione, avvenuta nel [[1996]] si è resa necessaria per '''separare i contenuti dalla [[formattazione]]''' e imporre una programmazione più chiara e facile da utilizzare, sia per l'autore che per l'utente.

== Motivi ed evoluzione dei CSS ==

Riga 40:

=== CSS 3 ===

Le specifiche CSS 3 non sono state ancora rilasciate, sebbene il W3C pubblichi costantemente [http://www.w3.org/Style/CSS/current-work informazioni] sulle novità in fase di sviluppo. I CSS 3 dovrebbero presentare soluzioni per la correzione di alcuni bachi di interpretazione di Internet Explorer, migliorie nella gestione degli sfondi e una soluzione per realizzare i '''bordi arrotondati''' che la cui realizzazione affligge i webdesigner da tempo.

== Il codice CSS ==

=== Inserire il codice ===

L'inserimento di codice CSS nelle pagine web può essere effettuato in due modi:

*Inserendo nel tag <code>&lt;head></code> della pagina un [[link|collegamento]] ad un foglio di stile '''esterno''', cioè un file contrassegnato dall'estensione ''.css'' come negli esempi seguenti:

Riga 70 ⟶ 71:

</head>

=== Una regola CSS ===

Le regole CSS sono strutturate secondo il seguente schema:

''selettore'' {

Riga 198 ⟶ 200:

p {

margin : 5px;

padding: 0;

}

Riga 214 ⟶ 217:

font-family : Arial, Verdana, sans-serif;

}

== Browser e CSS ==

Il supporto completo e corretto delle specifiche CSS non è offerto da nessun browser attuale. Tuttavia esistono browser che si avvicinano molto a questo risulatato ed altri che invece ne sono molto lontani. La lista che segue è di [[motore di rendering|motori di rendering]] perchèperché a loro è assegnato il compito di formattare la pagina secondo le istruzioni CSS.

*Trident ([[Internet Explorer]] e AOL Browser): Internet Explorer è attualmente il browser più diffuso e il suo supporto molto scarso dei CSS è probabilmente il maggior freno al loro sviluppo. Explorer presenta infatti molti [[Bug_(informatica)|bachi]] nella formattazione delle pagine, che le rendono diverse da quelle ottenute con altri browser. In aggiunta ai bachi, Explorer non supporta assolutamente alcune porzioni delle specifiche CSS 2. Le mancanze più gravi sono l'assenza di supporto per i '''contenuti generati''' e per il '''selettore di attributo'''. Gli unici strumenti a disposizione dei [[web designer]] sono i ''commenti condizionali'', una particolare funzionalità di Explorer che consente di inviare istruzioni solo a questo browser. La sintassi dei commenti condizionali è la seguente:

Riga 259 ⟶ 261:

== Fogli di stile preferiti e alternativi ==

Come descritto, ad ogni pagina si possono collegare '''più fogli di stile'''. Tuttavia è anche possibile '''far scegliere all'utente quali applicare'''. Per farlo si definiscono innanzitutto i fogli di stile permanenti, cioè non disattivabili, secondo la sintassi già vista. Poi si definiscono i fogli preferiti, cioè attivi al caricamento della pagina, ma disattivabili, aggiungendo l'attributo <code>&lt;title></code> come nell'esempio che segue:

<link rel="stylesheet" type="text/css" href="foglio_preferito.css" '''title="Esempio1"'''>

Riga 267 ⟶ 269:

<link rel="'''alternate''' stylesheet" type="text/css" href="foglio_alternativo.css" '''title="Esempio2"'''>

Per attivare e disattivare i fogli di stile l'utente può ricorrere all'apposito menu del suo browser, tuttavia Internet Explorer non offre questa possibilità quindi è necessario creare uno script [[Javascript]] che svolga la funzione di sostituire i fogli. Il codice è stato pubblicato la prima volta su {{en}} [http://www.alistapart.com/articles/alternate www.alistapart.com] ed è ora comunemente utilizzato. Tuttavia se questo script è facile da mettere in opera per gli sviluppatori, richiede un browser moderno con un buon supporto del [[DOM]], oltre che avere attivati sia Javascript e i cookie. Un sistema più complesso ma molto più robusto può essere uno script [[lato server]] come [[PHP]]. Un esempio è disponibile sempre sullo [http://www.alistapart.com/articles/phpswitch/ stesso sito].

== Voci correlate ==

*[[Accessibilità_(informatica)|Accessibilità]]

*[[Browser]]

*[[Pagina web]]

Riga 279 ⟶ 281:

* {{en}} [http://www.w3.org/TR/CSS21 Specifiche ufficiali CSS 2.1]

* {{en}} [http://www.w3.org/Style/CSS/current-work Progetto CSS 3]

* {{en}} [http://jigsaw.w3.org/css-validator/ Validatore CSS]

* [http://www.html.it/css/ Guida ai CSS] di html.it

* [http://www.constile.org constile.org] Sito dedicato all'uso dei CSS

* [http://lau.csi.it/risorse/CSS2/index.shtml Lista delle proprietà CSS2 con descrizione delle funzionalità, valori e supporto dei browser.]

[[Categoria:Linguaggi di markup]] [[Categoria: Internet]] [[Categoria:Informatica]]

{{Link_AdQ|en}}

[[ar:صفحات الطرز المتراصة]]

[[bs:CSS]]

Riga 296 ⟶ 302:

[[fi:CSS]]

[[fr:Feuilles de style en cascade]]

[[he:CSSCascading Style Sheets]]

[[hu:CSS]]

[[id:CSS]]

[[is:Cascading Style Sheets]]

[[ja:Cascading Style Sheets]]

[[ko:CSS]]

[[lt:CSS]]

[[nl:Cascading Style Sheets]]

[[nn:Stilark]]

Riga 305 ⟶ 314:

[[pl:Kaskadowe arkusze stylów]]

[[pt:Cascading Style Sheets]]

[[ro:Cascading Style Sheets]]

[[ru:CSS]]

[[simple:CSS]]