Публикации по теме 'bem'
Привет, спасибо за статью.
Привет, спасибо за статью.
С такими же проблемами мы сталкиваемся при попытке связать модули БЭМ и CSS. Мы рефакторим кодовую базу с AngularJS на React с новым дизайном, поэтому у нас есть некоторые конфликты классов css из старых стилей для общих компонентов, таких как кнопки, ссылки и т. д. (это причина использования модулей CSS). Как вы уже сказали, переход только на модули CSS принесет много неудобств, кроме того, мы установили БЭМ в качестве решения для наших команд, поэтому мы..
БЭМ - Smart Sass Architecture для начинающих
Что такое БЭМ?
Методология Блок , Элемент и Модификатор (БЭМ) - это общепринятое соглашение об именах классов CSS, разработанное Яндексом . Основная идея БЭМ - обеспечить строгий способ организации классов CSS в модули. БЭМ фиксирует цель и значение с помощью синтаксиса имени класса CSS:
Блок : представляет модуль или контекст, в котором находится элемент. ( « Что это?» )
навигация нижний колонтитул предмет-обзор
Элемент : описывает компонент внутри блока, который..
Вопросы по теме 'bem'
SASS @at-root с множественным родительским селектором
У меня небольшая проблема, и поиск пока не дал никаких результатов. Но это то, что продолжает появляться.
Я использую SASS pre для работы с корнем @at-root, чтобы я мог использовать синтаксис BEM CSS.
У меня есть следующий SCSS:...
3481 просмотров
schedule
18.12.2022
Какой смысл в явном именовании классов-потомков БЭМ при наличии SCSS?
Я пытаюсь подобрать и понять причины, лежащие в основе соглашений об именах CSS, таких как BEM или SUITCss. Мне трудно понять значение имен классов-потомков в присутствии SCSS.
Например:
<ul class="menu">
<li...
1229 просмотров
schedule
14.03.2023
Соглашения об именах Бэм
Я использую соглашение об именах БЭМ в небольшом проекте и испытываю небольшие трудности с выбором между именами элементов и модификаторов.
В настоящее время я работаю над разделом hero/splash на сайте. см. изображение ниже .
Вот мой...
495 просмотров
schedule
17.01.2024
Как правильно установить область действия элемента с помощью БЭМ?
Учитывая следующую древовидную структуру БЭМ, в которой существует пять вложенных уровней:
collection-main__features-top__story__byline__author
в соответствии с соглашением об именах БЭМ, где элемент является частью блока и не имеет значения...
3365 просмотров
schedule
16.12.2022
sass родитель родительской специфики
Я пишу CSS в стиле БЭМ и имею такой код:
.nav {
&__list {
&__item {
}
}
&__link {
&--active {
}
}
}
Как получить .nav .nav__link--active и .nav__link.nav__link--active из кода выше?...
697 просмотров
schedule
30.04.2024
Использование БЭМ CSS с директивами Angular
Я использую CSS в стиле БЭМ для стилизации своих угловых директив и обычно использую replace: true, чтобы мой класс уровня блока мог находиться в «корне» пользовательского элемента. Это делает так, что я могу писать весь свой CSS в основном с помощью...
1896 просмотров
schedule
29.10.2022
Как назвать вложенные элементы с помощью БЭМ и SMACCS
Я только начал использовать BEM и SMACCS для своих таблиц стилей, но столкнулся с некоторыми проблемами при именовании глубоко вложенных элементов в DOM. Скажем, например, у меня есть div с именем .main-container . Внутри первого уровня...
943 просмотров
schedule
17.08.2023
Разве SMACSS, BEM и OOCSS не так переносимы?
Итак, у меня проблема с OOCSS. Предполагается, что он более портативный, но по сравнению с тем, как я обычно это делаю, я нахожу его менее портативным.
Мой пример:
У меня есть отзыв о виджете. В основной части контента (с белым фоном) отзыв...
687 просмотров
schedule
17.06.2022
Как модифицировать несколько элементов блока с помощью БЭМ CSS
Допустим, у меня есть следующая настройка,
.block
.block__header
.block__content
.block__footer
Теперь я хочу показать активное состояние этого блока. Допустим, сам блок получает зеленый фон, а элементы 2 и 3 должны быть выделены...
1695 просмотров
schedule
12.02.2023
Блок css bem внутри блока именования
HTML-макет
<div class="site-header">
<ul class="site-header__social social"> <!-- block -->
<li class="social__li">social icon here</li>
<li class="social__li">social icon here</li>...
531 просмотров
schedule
15.07.2022
Селектор нескольких классов БЭМ
Я пытаюсь следовать соглашению об именах БЭМ и не знаю, как реализовать следующее: У меня есть блок «подсказки», который должен быть оформлен в разных темах. Допустим, я применяю тему «по умолчанию».
<div class="tooltip...
1460 просмотров
schedule
09.02.2024
Использование Bootstrap с его css
Увидев соглашения об именах БЭМ.
Я бы очень хотел использовать bootstrap sass с этими методами.
Можно ли расширить начальную загрузку для использования имен классов в стиле БЭМ?
.block {}
.block__element {}
.block--modifier {}
Например,...
873 просмотров
schedule
06.02.2023
БЭМ и форма ввода
Я пробую БЭМ в новый проект (страница формы) и я ищу лучший способ разметки входных данных формы.
У меня есть набор общих стилей для переключателей, которые я считаю «элементом» поля формы «блоки». Итак, я дал ему класс:...
1109 просмотров
schedule
28.08.2023
БЭМ-подход к элементу, чем он может принадлежать и выглядеть по-разному в зависимости от Блока?
Допустим, у меня есть стилизованный флажок (подумайте о дизайне материалов, где немного происходит достижение желаемого стиля флажка). Какой блок отвечает за изменение зависимого от родителя дочернего блока?
Пример компонента — флажок
Итак, у...
1698 просмотров
schedule
28.01.2023
Сложности с БЭМ-модификаторами scss
Мне трудно понять, как правильно писать scss с соглашениями об именах BEM.
Здесь у меня есть HTML:
<div class="SomeBlock">
<div class="SomeBlock__someElement">text</div>
</div>
<div class="SomeBlock">...
583 просмотров
schedule
18.02.2023
Как реализовать тему при написании CSS по методологии именования БЭМ?
Я использую соглашение об именах BEM CSS в проекте, над которым работаю. Пока все персиково. Однако мне нужно реализовать несколько тем (имеется в виду несколько разных дизайнов) на одной и той же html-странице. Написание этого:
.name-of-theme...
1836 просмотров
schedule
08.05.2023
Как получить root права в Stylus?
У меня проблема с корневой вложенностью
для лучшей работы с бем-модулями в Sass мы используем $root
.block
$root: &
background: gray
&__elem
background: red
color: black
&:hover
#{$root}__elem
color:...
918 просмотров
schedule
24.10.2022
BEM & Sass — как подойти к базовым, глобальным правилам типа гида по стилю?
Я использую БЭМ для всего и ценю преимущества.
Существует базовое глобальное руководство по стилю, предоставленное дизайнерами, в том числе
Заголовок1
Заголовок2
основной текст
основная кнопка
дополнительная кнопка
(и некоторые...
631 просмотров
schedule
05.04.2024
Запутался с БЭМом: как быть с тегами IMG и TABLE
Я пытаюсь разобраться в соглашении об именах БЭМ в CSS, но некоторые части меня немного сбивают с толку.
В моем случае мой HTML (на грубом уровне) выглядит так:
<div class="wrapper">
<img src="images/img.png">
<span...
1989 просмотров
schedule
03.11.2022
Концептуальные проблемы с БЭМ и вложением
Я пытаюсь адаптировать некоторый код HTML/CSS к методологии БЭМ, но, увидев классы для HTML, я думаю, что делаю что-то не так.
У меня есть вложенный объект "footer__social" с некоторыми вложенными значками. Следуя совету часто задаваемых вопросов...
136 просмотров
schedule
02.10.2022
