|
Possiamo inserire i fogli di stile nel nostro documento in vari modi:
Incorporando un foglio di stile esterno
I fogli di stile esterni sono dei file in cui vengono definite tutte le proprietà della pagina a cui si desidera applicare la formattazione e sono separati dal documento principale. Possono essere richiamati in alcuni modi: tramite la dichiarazione che fa uso dell’elemento <link> o tramite la direttiva @import, queste dichiarazioni vanno sempre inserite tra i tag <head> ed </head> della pagina.
<link href="miostile.css" rel="stylesheet" type="text/css" />
Oppure
<style>
@import url(miostyle.css);
</style>
Il primo metodo presenta anche altri attributi di cui è importante conoscere le modalità d'uso:
media : Questo attributo è opzionale e serve per impostare un foglio di stile per ogni supporto sul quale verrà visualizzata o distribuita la pagina.
I suoi valori sono:
- all: Applicato alla visualizzazione su tutti i dispositivi.
- screen: Applicato alla visualizzazione sui normali browser web.
- print: Applicato in fase di stampa.
- projection: Applicato alle presentazioni e le proiezioni a schermo intero.
- aural: Applicato in dispositivi a sintesi vocale.
- braille: Applicato a supporti basati sull’uso del braille.
- embossed: Applicato a stampanti braille.
- hendheld: Applicato a dispositivi palmari o simili.
- tty: Applicato a dispositivi con carattere fisso.
- tv: Applicato a tv web.
rel: Questo attributo descrive la relazione che intercorre tra il documento html ed il foglio di stile, è obbligatorio e ha solo due valori: alternate e stylesheet. I primo serve per attribuire normalmente la formattazione al documento, il secondo invece per identificare un foglio di stile alternativo a quello principale, in questo modo il webmaster avrà la possibilità di creare un sistema (tramite un linguaggio di scripting) che permetta all’utente di scegliere lo stile per la visualizzazione della pagina.
<link rel="stylesheet" type="text/css" href="miostile.css" />
<link rel="alternate stylesheet" type="text/css" href="stile_alternativo.css" />
href: Questo attributo serve per specificare l’url, che può essere assoluto o relativo, al foglio di stile da incorporare.
type: Questo attributo specifica il tipo di dati che verrà collegato, ricordiamo che questo attributo è obbligatorio ma per i fogli di stile può avere solo un valore, ovvero text/css.
La direttiva @import e da preferirsi in quanto elimina i problemi di compatibilità con i vecchi browser, l’url specificato in questa dichiarazione può essere sia assoluto che relativo.
Fogli di stile incorporati
La dichiarazione, come per i fogli di stile esterni deve avvenire dentro la sezione <head></head> del documento, usando l’elemento <style> e può avere solo due attributi: media e type.
<stile type=”text/css” media=”screen”>
body{
background-color:#000000;
color:#ffffff;
}
</style>
Fogli di stile in linea
La formattazione con i fogli di stile in linea può essere applicata a tutti gli elementi tramite l’attibuto style e prevale sulle altre dichiarazioni, siano esse in fogli di stile esterni o in fogli di stile incorporati.
<p style=”color:#ffff00; text-decoration:underline;”>Testo </p>
|
Css 
Copyright © 2007-2008