PDA

View Full Version : [CSS] Selettori in fila con virgola e senza: cosa significa?


Matrixbob
14-12-2011, 08:01
[CSS] Selettori in fila con virgola e senza: cosa significa?

Es1, promisquo con virgola e senza:

.z-button .z-button-tl,.z-button .z-button-tr,.z-button .z-button-bl,.z-button .z-button-br,.z-button .z-button-tm,.z-button .z-button-bm,.z-button .z-button-cl,.z-button .z-button-cr,.z-button .z-button-cm
{
background-image: none;
}


Es2, senza virgole

.zk .z-tabpanel .zk .z-window-embedded {
text-align: left;
background: #d4e1f7;
text-align: left;
margin: 0px auto 30px auto;
}


Es3, con virgole

.z-tabs,.z-tabs-header,.z-center-body {
width: 100% !important;
}


Voi avete idea della differenza?

wingman87
14-12-2011, 09:16
Ti consiglio di leggere il tutorial di w3schools: http://www.w3schools.com/css/default.asp

Matrixbob
14-12-2011, 10:51
Ti consiglio di leggere il tutorial di w3schools: http://www.w3schools.com/css/default.asp

L'ho letto, ma o non trovo io gli esempi simil-miei o non li capisco. :boh:

Mi pare che CON le virgole sto dicendo di applicare a quel elenco di selettori quello che trova tra {...}.

Mentre mi pare che SENZA virgole dice ai selettori più annidati dentro i selettori più esterni.

Vi risulta così anche a voi?

Per selettori io intendo sia tag, che classi, che identificatori, forse di norma sono chiamati elementi ... :boh:

Matrixbob
14-12-2011, 10:57
Ecco l'esempio che forse corrobora la mia teoria:
CSS Grouping and Nesting Selectors (http://www.w3schools.com/css/css_grouping_nesting.asp)
Ho ragione quindi?

Grouping Selectors: fai di tutta l'erba un fascio?

h1,h2,p {
color:green;
}


Nesting Selectors: solo i paragrafi dentro la classe marked?

p {
color:blue;
text-align:center;
}
.marked {
background-color:red;
}
.marked p {
color:white;
}


Di conseguenza questo è un casi ibrido

.z-button .z-button-tl,.z-button .z-button-tr,.z-button .z-button-bl,.z-button .z-button-br,.z-button .z-button-tm,.z-button .z-button-bm,.z-button .z-button-cl,.z-button .z-button-cr,.z-button .z-button-cm
{
background-image: none;
}

wingman87
14-12-2011, 11:17
Sì, perché un nested selector è pur sempre un selettore.
Quindi il poter raggruppare più selettori separandoli con virgola comprende anche il poter raggruppare selettori annidati.