HTML BEM 块的标记

HTML markup for BEM block

The BEM methodology 说:

In HTML, the block markup is repeated every time the block appears on the page.

也就是说,你不能这样做?

<div class="menu">
    <div class="menu__logo></div>
    <a class="menu__link></a>
</div>
<div class="menu">
    <button class="menu__exit-button></button>
</div>

由于同一块中的标记不同

我会这样做,而不是有两个街区

  <div class="menu">
    <div class="menu__logo></div>
    <a class="menu__link></a>
    <button class="menu__exit-button></button>
</div>

您的属性缺少右引号

根据情况,块内部可以有不同的标记。

<div class="menu">
  <div class="menu__logo">
    <img src="" alt="">
  </div>
  <nav class="menu__nav">
    <a href="">Home</a>
    <a href="">About</a>
  </nav>
  <button class="menu__exit-button"></button>
</div>

Do you have use case/design we can look at?