html - 使用 BEM 方法添加相同的元素名称

Question

我开始使用 BEM 方法，据此我有一个问题。
例子：

<div class="container">
  <div class="container__block-1">
    <h1 class="container-title">block1</h1>
  </div>
  <div class="container__block-2">
    <h1 class="container__title container-title">block2</h1>
  </div>
  <div class="container__block-3">
    <h1 class="container__title container-title">block3</h1>
  </div>
</div>

您如何看到我使用：container__title块 2 和块 3 中的元素。我需要这个来为h1. 问题
：我可以根据方法使用相同element的方法吗？container__block-2container__block-3BEM

标签： htmlcssbem

Answer 1

只要您希望与上述块具有相同的属性，就可以对另一个块使用相同的元素。

但是，如果您需要一个变化，那就是modifier发挥作用的时候。

每当您需要仅更改一组元素中的特定元素时，您可以在此处使用修饰符。它表示为block__element--modifier。

<div class="container">
  <div class="container__block-1">
    <h1 class="container-title">block1</h1>
  </div>
  <div class="container__block-2">
    <h1 class="container__title container__title--modifier1 ">block2</h1>
  </div>
  <div class="container__block-3">
    <h1 class="container__title container__title--modifier2">block3</h1>
  </div>
</div>