БЭМ и css рамки - PullRequest
       43

БЭМ и css рамки

0 голосов
/ 17 февраля 2020

Как использовать методологию БЭМ с css фреймворками, например 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>

или структурировать документ типа shouild I следующим образом:

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

1 Ответ

2 голосов
/ 17 февраля 2020

вы не должны пытаться применять методологию BEM для служебных классов, таких как «контейнер, строка, столбец» и т. Д., Но вы можете попробовать вспомогательные ситуации col col--xs-12 или img img--cover

Вы можете проверить больше служебные классы в bootstrap документе; 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>

Вам лучше использовать его в качестве первых блоков кода.

...