1. 17. 6. БЭМ для CMS

Несмотря на то, что каскад в БЭМ не приветствуется, для систем управления контентом всё же сделано исключение. Можно создать обёртку, к примеру, <div class="raw-content">, в которую попадёт разметка из визуального редактора.

<div class="raw-content">
  <h2>Разработка бренда селективной парфюмерии HH Project</h2>
  <img src="img/empty-img.svg" width="1200" height="60" alt="">
  <p class="lead">HH — новый бренд был создан в 2020 году парфюмером Vila Khonskaya.</p>
  <p>Ароматы HH представляют собой вибрирующее, звенящее напряжение, сдерживаемое каменным, вулканическим флаконом.</p>
</div>

А стили задавать, используя каскад:

.raw-content h2 {
  margin: 20px 0;
  font-weight: 700;
  font-size: 30px;
  line-height: 1.5;
}

/* стили для абзаца с текстом лида, используем не только каскад, но и комбинацию тег + класс */
.raw-content p.lead {
  margin: 15px 0;
  font-size: 24px;
  line-height: 1.5;
}

.raw-content p {
  margin: 10px 0;
}

Last updated