css consigliato notazione

Question

Ho un div con un ID:

<div id="main"> 

Qual è la corretta (o differenza) tra

div#main { 

e

#main { 

saluti,

Answer 1

C'è a great doco sull'uso efficiente selettori CSS, concentriamoci su regole con selettori eccessivamente qualificati:

selettori di ID sono unici per definizione. Includendo tag o classe i qualificatori aggiungono semplicemente informazioni ridondanti che devono essere valutate senza necessità .

Invece di applicare lo stile ad un elemento con ID main, il vostro selettore riqualificare l'elemento controllando se o non è anche un div (in questo ordine).Per chiarire: selettori CSS vengono valutati destra a sinistra, a differenza stessa sintassi di selezione quando viene utilizzato in jQuery ecc

suggerimento di

Re pixelistik che div#main è più specifico di #main - sì, che è tecnicamente corretto, se avete a ricorrere a questo per aumentare la specificità di una regola, è probabile che la struttura del CSS su cui stai lavorando non sia pensata come dovrebbe.

Answer 2

Quindi la differenza è questa:

Quando si scrive lo stile div#main sarà solo per l'elemento <div>. Quando si scrive #main può essere usato come stile per <div>, <span>, <p>, ecc

E che cosa consigliare è difficile da dire, ogni sviluppatore che ha diverso. Quindi, ad esempio, utilizzo span.<nameClass> quando è nidificato in <li> per esempio.

#nav li span.href a { 
... 
} 

Penso che sia usato quando si desidera che una classe con un nome specifico possa avere un solo elemento.

Così quando scrivi span#href funzionerà solo per <span id="href">Simply dummy text</span> non per gli altri. Quando scrivi #href funzionerà per <span id="href">Simply dummy text</span> o <a href="#" id="href">Link</a> ma entrambi sono corretti quando chiedi anche questo. Differenze ho scritto sopra.

Answer 3

#main corrisponde a tutto con ID 'principale', mentre div#main corrisponde solo a <div> elementi con ID principale. Idealmente, non dovresti mai avere due elementi con lo stesso ID, quindi realisticamente i due non fanno la differenza, ma ci sono probabilmente problemi relativi alle prestazioni riguardanti la possibilità di specificare il risultato più rapidamente se si specifica div.

Answer 4

Entrambi sono corretti.

div#main è più specifico di #main, il che significa che gli stili definiti con il primo selettore sovrascriveranno quelli del secondo.

Ecco una buona introduzione alla specificità CSS: http://htmldog.com/guides/cssadvanced/specificity/