#17 БЭМ: блок, элемент, модификатор [Курс по Верстке от AROKEN]

• В верстке используются ID, теги и классы.  

• Классы предпочтительны для настройки элементов.  

• Методология БЭМ от Яндекса помогает разработчикам согласованно называть классы UI элементов.  

• Методология включает блоки, элементы и модификаторы.  

• Блоки — это самостоятельные элементы, которые можно переиспользовать.  

• Элементы — это части внутри блока, которые можно назвать по методологии БЭМ.  

• Пример создания блока для карточки пользователя.  

• Элементы блока называются с использованием методологии БЭМ.  

• Пример именования элементов: изображение, никнейм, описание.  

• Модификаторы добавляют характеристики элементам.  

• Пример добавления модификатора цвета к тексту.  

• Модификаторы могут быть добавлены через JavaScript для динамического изменения свойств элементов.  

• Обсуждение необходимости практики и примера.  

• Создание структуры сайта с использованием методологии BEM.  

• Пример создания блока с элементами видео и контента.  

• Создание блока с классом grid и элементами видео и контента.  

• Использование 7-ми там для экономии времени.  

• Пример создания структуры с классом и элементом контента.  

• Создание блока с элементами заголовка и кнопки.  

• Создание блока с четырьмя одинаковыми элементами.  

• Использование класса для создания колонок.  

• Создание блока about с элементами контента и видео.  

• Добавление кнопок социальных сетей.  

• Пример создания блоков внутри блоков.  

• Создание блога с элементами и колонками.  

• Практическое применение методологии BEM.  

• Домашнее задание: повторить структуру сайта с использованием методологии BEM.