Я знаю о методах, основанных на использовании так называемых независимых блоков. Блок здесь - это часть страницы, которая может быть описана своим собственным макетом и своими собственными стилями. Есть некоторые принципы этих методов, такие как использование только атрибута класса, а не идентификатора; каждый блок имеет префикс; нет стилей вне блоков или минимальных глобальных стилей. Но это не обязательно более или менее. Предположим, у вас есть блок:
<code><div class="b-my-block">
<span>some more content</span>
</div>
И стиль для этого блока:
.b-my-block{
width:100%;
height:300px;
}</p>
<p>.b-my-block span{
background:red;
}
'b' здесь - префикс для блока. Вы можете иметь разные префиксы для ваших нужд. Возможно, вы захотите использовать префикс «g» для некоторых глобальных классов, которые могут применяться и изменять любые другие элементы.
Затем, если вы хотите расширить этот блок или как-то изменить его, вы можете создать модификацию этого блока с помощью класса 'b-my-block_blue', например:
<code><div class="b-my-block b-my-block_blue">
<span>some more content</span>
</div>
и кусок css:
.b-my-block_blue span{
background:blue;
}
Это очень, очень грубый пример. И я не уверен, достаточно ли я объяснил. Но я пытаюсь использовать эту технику в моем текущем проекте, и до сих пор это выглядит довольно хорошо. На этом есть статья . Может быть, кто-то мог бы перевести это на английский, если это будет интересно для людей здесь.