andrei500
@andrei500
Middle Frontend Vue.js

Зависимость элемента от реализации дочернего элемента, допустима по БЭМ?

<div class="content">
       <div class="content__text-block">
	        <div class="content__head">Крупный текст</div>
	        <div class="content__desc">обычный текст</div>
        </div>
</div>

.content
   &__text-block
      font-size: 1.2rem
   &__head
      font-size: 2em
   &__desc
      font-size: 1em

Правильно ли по БЭМ, если размер шрифта элемента зависит от реализации родительского элемента?
Или в таких случаях необходимо сделать элемент text-block блоком?
  • Вопрос задан
  • 46 просмотров
Решения вопроса 1
RedEagle69
@RedEagle69
Html-верстальщик, Front-end разработчик
Ну во-первых, нужно поработать над семантикой в html. Сборная div-янка это совсем не круто.
Вот два варианта реализации:
1)
<section class="content">
  <div class="content__text-wrap">
    <h2 class="content__title">Заголовок</h2>
    <p class="content__descr">Блок с текстом</p>
  </div>
</section>

2)
<section class="content">
  <div class="content__text-wrap article">
    <h2 class="article__title">Заголовок</h2>
    <p class="article__descr">Блок с текстом</p>
  </div>
</section>

А по поводу размера шрифта: большой разницы нет, всё зависит от контекста. Не забывайте про модификаторы. Верстать можно и так и сяк и наперекосяк.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы