classe fixation enfant dans la classe parent dans css

Question

Alors, j'ai divs comme suit:

<div class="first"> 
    <div class="second"> 
     <div class="third"> 
     <div class="fourth"> 

     </div> 
     </div> 
    </div> 

Pour css, je blême d'inclure "Second", "troisième" et "quatrième" à l'intérieur de "premier" comme ci-dessous (mais évidemment pas correct).

.first{ 
    .second{some css} 
    .third{some css} 
    .fourth{some css} 
} 

Quelle est la bonne façon de lier la classe interne dans une classe supérieure sans répéter la classe supérieure?

Answer 1

Essayez SASS.

Sass vous pouvez le faire:

nav { 
    ul { 
    margin: 0; 
    padding: 0; 
    list-style: none; 
    } 

    li { display: inline-block; } 

    a { 
    display: block; 
    padding: 6px 12px; 
    text-decoration: none; 
    } 
} 

SASS Official Page