Как экранировать стили?

Question

[hinie]

Как экранировать стили?

<div>
  <button>ShouldBeRed</button>
  <style>
  button{
    background:red;
  }</style>
</div>
<div>
  <button>shouldBeGreen</button>
  <style>
  button{
    background:green;
  }</style>
</div>
<div>
  <button>shouldBeDefault</button>
</div>

Использовать инлайн атрибуты не получится из-за длинных стилей.

Comments

[Сергей delphinpro]

Использовать инлайн атрибуты не получится из-за длинных стилей.

Почему? "Длинные" стили почему-то стали запрещены?

[Антон Литвиненко]

про классы слышали?

[Александр Васильев]

экранировать от чего.
Если это шаблонизатор "ругается" - поставьте пробелы вокруг фигурных скобок либо отформатируйте код в html
а так ... тут достаточно написали

Answer 1

[Алексей Уколов]

Куда «экранировать»? Зачем «экранировать»? Вы хотите, чтобы стиль магически применялся только к лежащей рядом с ней кнопке? Так не работает. Используйте классы или идентификаторы, если не хотите инлайново писать. Ну или какой-то сложный селектор. Короче, в стиле должно быть явно указано какую button вы имеете в виду от корня документа.