HTML e fogli di stile(CSS)


Sono ormai divenuti molto comuni sul web.
Tecnica che permette di fissare gli stili (per es. tipo di carattere, colori e spaziature)
da applicare ai documenti Web tipo HTML e XHTML.


CSS: dove si definiscono; Ereditarietà e cascade


Un altro concetto fondamentale che dovreste assimilare è quello della struttura ad albero di un documento.

Il meccanismo fondamentale dei CSS è infatti l'ereditarietà.

Esso fa sì che molte proprietà impostate per un elemento siano autamaticamente ereditate dai suoi discendenti.

Sapersi districare nella struttura ad albero significa padroneggiare bene questo meccanismo e sfruttare al meglio la potenza del linguaggio.

Presentiamo subito un frammento di codice HTML:

<html>
    <head>
       <title>Struttura del documento</title>
    </head>
    <body>
        <h1>Titolo</h1>
        <div>
          <p>Primo <a href="pagina.htm">paragrafo</a></p> 
        </div>
          <p>Secondo<b>paragrafo</b></p>
    </body>
</html>

Embedded :

<HEAD>
   <STYLE TYPE="text/css">
        H1 {color:blue; font-style:italic;} 
        H2 {color:red; font-style:italic;}
        H3 {color:yellow; font-style:italic;}
        B {color:green; font-style:italic;}
   </STYLE>
</HEAD>
<BODY>...</BODY>

External :

<HTML>
    <HEAD>
        <LINK REL="stylesheet? TYPE="text/css"HREF="stile.css">        </HEAD>


Inline :

<H1 STYLE="color:red; text-ransform:capitalize;"> Test di stile </H1>


Ereditarietà e cascade :

>Vale il concetto di ereditarietà degli stili
> Si possono importare più fogli di stile nello stesso documento
> Conflitti risolti mediante le cascade rules
>Viene data priorità alle regole definite nel documento
Copyright (c) 2010 ilcorsaronero. All rights reserved.