PCdaZERO.it - Guida facile per usare il computer

Acquista o scarica gratis, i libri di "PC da Zero"

CREARE SITI WEB in HTML e CSS    >     Selettori specifici





Nelle precedenti lezioni, hai visto che per differenziare il formato di uno stesso elemento si è fatto ricorso alle classi.

Ad esempio, nel Foglio Stile sono dichiarate diverse classi:
.nerobianco {background-color: black;color: white;}
.gialloverde {background-yellow: black;color: green;}

applicate poi agli elementi HTML
<h1 class="nerobianco"> Un titolo in bianco e nero</h1>
<h1 class="gialloverde"> Un titolo in giallo e verde</h1>
<p class="nerobianco"> Un paragrafo in bianco e nero</p>
<p class="gialloverde"> Un paragrafo in giallo e verde</p>

Puoi raggiungere lo stesso obbiettivo facendo precedere (nel Foglio Stile) l'elemento da formattare, dagli identificatori (di blocchi) e/o da altri elementi che lo contengono.
Ad esempio con le dichiarazioni
#contenitore p {background-color: black;color: white;}
#piedipagina p {background-yellow: black;color: green;}

oppure
div#contenitore p {background-color: black;color: white;}
div#piedipagina p {background-yellow: black;color: green;}

i paragrafi creati all'interno del blocco "contenitore" saranno formattati in bianco e nero;
i paragrafi creati all'interno del blocco "piedipagina" saranno formattati in giallo e verde.

Ecco l'esempio da applicare tra i TAG <body>:
<div id="contenitore"> <p> Paragrafo in bianco e nero<p> </div>
<div id="piedipagina"> <p> Paragrafo in giallo e verde<p> </div>
<p>Paragrafo non formattato<p>







Link sponsorizzati