Html 用边界元CSS制作滑块

因此，如果我使用边界元法创建滑块，它会像这样：

              <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>

或：

---

请填写并解释

元素用两个2下划线分隔，修饰符用两个2连字符分隔-

在您的情况下，应该使用两个下划线

---

元素的名称通常来自嵌套在其中的块。因此，我认为在这种情况下，示例1和示例2都不正确

我最初的想法是这样的布局：

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

如果每张幻灯片彼此略有不同，则应使用以下修改器：

<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>

<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>