Faire un curseur avec EBM CSS

Question

Donc, si je devais utiliser BEM pour créer un curseur serait-il ressembler à ceci:

   <div class="slideshow"> 
       <div class="slide slide--slide01"></div> 
       <div class="slide slide--slide02"></div> 
       <div class="slide slide--slide03"></div> 
       <div class="slide slide--slide04"></div> 
       </div> 

ou:

   <div class="slideshow"> 
       <div class="slide slideshow__slide01"></div> 
       <div class="slide slideshow__slide02"></div> 
       <div class="slide slideshow__slide03"></div> 
       <div class="slide slideshow__slide04"></div> 
      </div> 

S'il vous plaît me renseigner et expliquer

Answer 1

Les éléments sont délimités par deux (2) traits de soulignement (__) et les modificateurs sont délimités par deux (2) traits d'union (-).

Dans votre cas, vous devez utiliser deux underscore (__).

Original article

Answer 2

éléments obtiennent généralement leur nom à partir du bloc ils sont imbriqués. Par conséquent, je dirais que ni l'un ni exemple deux est correct dans ce cas.

Ma première pensée aurait la mise en page en tant que tel:

<div class="slideshow"> 
    <div class="slideshow__item"></div> 
    <div class="slideshow__item"></div> 
    <div class="slideshow__item"></div> 
    <div class="slideshow__item"></div> 
</div> 

Si chacune des diapositives seront légèrement différentes les unes des autres, vous pouvez utiliser les modificateurs tels que:

<div class="slideshow"> 
    <div class="slideshow__item slideshow__item--slide1"></div> 
    <div class="slideshow__item slideshow__item--slide2"></div> 
    <div class="slideshow__item slideshow__item--slide3"></div> 
    <div class="slideshow__item slideshow__item--slide4"></div> 
</div>