BEM and css frameworks

Question

如何在css框架中使用BEM方法，例如Bootstrap？如果我有以下标记结构，可以吗？：

<div class="hero">
<div class="container">
<div class="row">
<div class="col-md-8 mx-auto">
<h1 class="hero__title"></h1>
</div>
</div>
</div>
</div>

或者我应该这样构建文档：

<div class="hero">
<div class="hero__container">
<div class="hero__row">
<div class="hero__row-inner">
<h1 class="hero__title"></h1>
</div>
</div>
</div>
</div>

Answer 1

您不应该尝试将BEM方法应用于"container，row，col"等实用程序类，但您可以尝试助手情况col col--xs-12或img img--cover

您可以在引导程序文档中查看更多实用程序类；https://getbootstrap.com/docs/4.4/utilities/borders/

<div class="hero">
<div class="container">
<div class="row">
<div class="col-md-8 mx-auto">
<h1 class="hero__title"></h1>
</div>
</div>
</div>
</div>

你最好把它作为你的第一个代码块。