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 |