Обертывание идентификаторов в классах CSS?

Question

Я относительно новичок в CSS и задаюсь вопросом, можно ли его «обернуть» ID, чтобы вам не приходилось повторять их снова и снова?

т.е.

#home 
{ 
some stuff 
} 

#home .header { 
some stuff 
} 

#home .sub_header { 
some stuff 
} 

Можно ли «обернуть» в .header и .sub_header, так что я не должен повторять #home все время? то есть что-то вроде этого, чтобы идентификатор мог коллективно обернуть классы?

#home 
{ 
some stuff 
} 

@#home [ 

.header { 
some stuff 
} 

.sub_header { 
some stuff 
} 
] 

Answer 1

Отличный вопрос! Я боюсь, это невозможно с использованием родного CSS. Нет никаких реальных сокращений.

Если вы работаете с большим количеством CSS, есть предварительные компиляторы, которые позволяют вам использовать расширенную нотацию и преобразовывать ее в CSS на лету.

Там же, например

• xCSS это может nest child elements.

• Тогда есть LESS, это написано на Ruby, поэтому вам необходимо установить (насколько я понимаю, я еще не использовал его сам), но он отлично подходит для редактирования CSS в любой среде. Проверьте раздел «вложенные правила» на главной странице.

Если вы только начинаете работу с CSS, вы можете сначала использовать нотную нотацию. Но в тот момент, когда это становится действительно утомительным, эти инструменты помогают.

Answer 2

К сожалению, это невозможно в просто CSS, однако вы можете добиться этого с помощью генераторов CSS, таких как LessCSS, которые имеют свой собственный синтаксис и имеют такие функции, как вложенность и переменные.

Answer 3

Другой большой рамки CSS является CSS Scaffold

CSS Эшафот работает на PHP, проста в использовании

• позволяет глубокий селектор гнездящихся
• константы
• пользовательский Примесей (многоразовые куски CSS коды)
• реализует рамочное создание сетки
• кэширование из уже разобранных файлов CSS для производства (+ преуменьшать)

Если вы не кодирование большого сайт, я бы рекомендовал обычный CSS

Answer 4

Если вы используете PHP, рассмотреть возможность использования lessphp (http://leafo.net/lessphp/docs/) или http://www.symfony-project.org/plugins/sfLessPhpPlugin для symfony