Задать вопрос
@Narts
javascript

Инкапсуляция стилей блока?

Допустим на сайте есть див #demo. В этот блок подгружаются различные html элементы (навбары, кнопки, формы). Помимо html-разметки элементов, подгружаются их стили и js

Проблема в том, что основные стили сайта так же действуют на элементы #demo. Возможно ли как-нибудь инкапсулировать потомков #demo от основных стилей?
  • Вопрос задан
  • 354 просмотра
Комментировать
Подписаться 1 Средний Комментировать
Решения вопроса 3
Chefranov
@Chefranov
Новичок
Полноценно нельзя, планируется в будущем такое реализовать (по факту уже есть, но плохая поддержка браузерами) https://css-live.ru/articles/css-izolyaciya.html
Сейчас только наверно перебивать по типу reset.css или normalize.css исходя от корневого класса или id maxsite.org/page/scoped-css

Будет типа 
#demo h1 {margin: 5px 0}
#demo p {font-size: 20px}

... и т.д.
Ответ написан
Комментировать
Комментировать
@McBernar
Нативно нельзя, только js-фреймворками. Во vue scoped styles поддерживается, например.

Но можно просто не делать селекторов вида #div h1, а работать строго каждому элементу свой класс. Что, в общем-то, пропагандирует тот же бэм.
Ответ написан
Комментировать
Комментировать
delphinpro
@delphinpro Куратор тега JavaScript
frontend developer
Есть еще свойство all и значение initial
И вот здесь в ответах есть хак
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
SummerWeb • Ярославль
от 100 000 до 140 000 ₽
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
JavaScript Fullstack
OnClass
от 200 000 до 600 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Написать индикатор на TradingView по хаям/лоям дня недели
25 апр. 2024, в 08:45
4000 руб./за проект
Вычислить размер объекта по карте глубин
25 апр. 2024, в 07:37
5000 руб./за проект
Спарсить TON PLACE: скрейпинг фото и текста с анкет по списку URL
25 апр. 2024, в 05:57
3000 руб./за проект
Ещё заказы