I selettori (seconda parte)

Selettore universale

Con questo selettore è possibile applicare la formattazione a tutti gli elementi del documento, il blocco delle dichiarazioni deve essere preceduto da un asterisco.

*{color: blue}
 

Selettori di classe e di identità

I selettori di classe possono essere usati per tutti gli elementi , la loro dichiarazione deve essere preceduta da un punto.

<style type=”text/css”>
      .testoformattato{
            color:#ffff00;
            font-size:13px;
            font family:Arial, sans-serif, Helvetica
}
</style>
 

In questo caso lo stile verrà applicato a quegli elementi in cui è stato inserito il valore “testoformattato” nell’attributo class.

<p class=”testoformattato”>Testo</p>
<div class=”testoformattato”>Testo</div>
 

I selettori di identità, come nel caso dei selettori di classe, possono essere utilizzati per tutti gli elementi ma la loro dichiarazione deve essere preceduta dal cancelletto (#).

<style type=”text/css”>
      #testoformattato{
            color:#ffff00;
            font-size:13px;
            font family:Arial, sans-serif, Helvetica
}
</style>
 

In questo caso lo stile verrà applicato a quegli elementi in cui è stato inserito il valore “testoformattato” all’attributo id. La differenza tra i selettori di classe e di identità sta nel fatto che il selettore di identità contraddistingue in maniera univoca un elemento, quindi, se viene assegnata ad un tag  h1 un’identità questo valore non potrà piu essere utilizzato in tutto il resto della pagina, la classe invece può essere assegnata a più elementi, anche se sono dello stesso tipo

<p id=”testoformattato”>Testo</p>
 

I selettori di classe e di identità, inoltre, possono avere anche altre sintassi:

p.testoformattato{color:red}
 

lo stile verrà applicato a tutti i paragrafi con il valore “testoformattato” nell’attributo class.

p.testoformattato.bold{color:red; font-weight:bold;}
 

lo stile verra applicato a tutti gli elementi in cui sono presenti i valori “testoformattato” e “bold” nell’attributo class, anche se non rispettano l’ordine in cui sono stati dichiarati. Ad esempio:

<p class=”bold testoformattato”>Testo</p>
 

Anche per le identità è possibile una sintassi con un elemento:

p#testoformattato{color:#000000;}

Popularity: -1% [?]

Vuoi essere sempre aggiornato???  Iscriviti  ai feed o invia un  trackback