Prima di passare alla trattazione dei fogli di stile incorporati, ci preme sottolineare la diversa sintassi che regge questi attributi (e anche i successivi "css esterni") rispetto ad HTML classico:

  • gli attributi sono inseriti tra parentesi graffe { }
  • al posto del segno = vengono usati i due punti :
  • gli argomenti consecutivi sono separati dal segno ;
  • Gli attributi composti da piu' termini sono separati da un trattino -
  • Quando un attributo e' considerato proprieta' di un oggetto i trattini si elminano e le iniziali dei termini diventano maiuscole (per esempio: font-style diventa FontStyle)

    Premesso questo passiamo a trattare approfonditamente i fogli di stile incorporati. Banalizzando, si tratta di stili a meta' strada tra i gia' esaminati CSS in linea e i successivi CSS esterni. La peculiarita' fondamentale di questi attributi di stile e' di venire assegnati all'intero documento e non a singole istanze come l'HTML classico. Si tratta, dunque, di un insieme di definizioni di stile inserite tra marcature <STYLE> e posizionate tra i tag <HEAD> del documento e il <BODY> dello stesso.

    Un esempio di foglio di stile incorportato e' il seguente:

    <HTML>
    <HEAD>

    <style type="text/css">

    H1 { font-size:20px; font-family:verdana; color:green }
    H2 { font-size:18px; font-family:arial; color:red }

    </style>

    </HEAD>
    <BODY>

    <H1>Questo testo e' di colore verde, impostato su verdana di 20 pixel</H1>
    <H2>Questo testo e' di colore rosso, impostato su arial di 18 pixel</H2>

    </BODY>

    </HTML>

    Visualizza l'esempio pratico

    In questo esempio abbiamo impostato un foglio di stile incorporato tra i tag <HEAD> del documento, stabilendo due diversi tipi di carattere:
  • verdana verde di 20 pixel per il primo identificato dal marcatore <H1>
  • arial rosso di 18 pixel per il secondo, identificato dal marcatore <H2>

    I marcatori H1 e Hx in generale possono sostituirsi con altri marcatori di paragrafo quali <P>. Impostato il CSS incorporato all'interno del documento gli stessi stili vengono assegnati raccogliendo porzioni di testo tra marcatori <H1></H1> e <H2> </H2>.
    In questo modo cambiando i valori dei soli attributi impostati nel fogli di stile (aumentando la grandezza o modificando il colore, per esempio), il testo del documento marcato da <H1> e <H2> viene automaticamente aggiornato al nuovo stile.

    L'attributo TYPE del tag <STYLE> definisce il linguaggio in formato MIME del foglio di stile. In altre parole questo attributo indica al browser il tipo di foglio di stile supportato, altrimenti ignorato. Ms Internet Explorer supporta i CSS solo in formato MIME, ma esistono i CSS in formato text/jass, cioe' accessibili in javascript.
    Se l'attributo TYPE viene omesso, il browser lo identifica di default con text/css.
    Anche Netscape communicator supporta questo attributo.

    Rispetto ai fogli di stile in linea i CSS incorporati consentono il controllo di un intero documento, ma per interi siti non sono sufficienti a fornire il supporto tecnico necessario. Se per esempio per il testo dei documento e' stato usato un certo font e improvvisamente si decide di modificarlo, sara' necessario agire su tutti i documenti del sito perche' le modifiche si estendano all'intero Website.



    Css in linea Vai all'argomento precedente        Css Esterni Vai all'argomento successivo