Styles CSS imbriqués?

Question

Est-ce quelque chose comme cela possible?

.imgbox:hover{ .ui-resizable-se { /*some style */ } } 

Ou un équivalent conceptuel? Fondamentalement, seulement quand un élément d'une certaine classe est survolé, alors un élément dans cette classe devrait changer de style.

Answer 1

Vous pouvez faire ceci:

.imgbox:hover .ui-resizable-se { /*some style */ } 

Le sam e peut être généré par LESS ou SASS.

Answer 2

Bien sûr, ce serait:

.imgbox:hover .ui-resizable-se { /*some style */ } 

Answer 3

Non, CSS ne permet pas d'imbrication. Il faudrait écrire comme ceci:

.imgbox:hover .ui-resizable-se { /*some style */ } 

Cependant, il y a des préprocesseurs CSS disponibles qui convertissent quelque chose comme ça en CSS valide. Les plus populaires sont LESS et SASS/SCSS.

Answer 4

pas avec CSS simple mais vous pouvez avec un préprocesseur CSS comme Sass:

http://sass-lang.com/

table.hl { 
    margin: 2em 0; 
    td.ln { 
    text-align: right; 
    } 
} 

li { 
    font: { 
    family: serif; 
    weight: bold; 
    size: 1.2em; 
    } 
} 

Génère:

/* CSS */ 

table.hl { 
    margin: 2em 0; 
} 
table.hl td.ln { 
    text-align: right; 
} 

li { 
    font-family: serif; 
    font-weight: bold; 
    font-size: 1.2em; 
}