Возможно ли, чтобы классы CSS расширяли друг друга?

Question

У меня есть некоторые классы CSS, как:

.span9 { 
    width: 870px; 
    } 
    .span4 { 
    width: 370px; 
    } 

В другом пользовательском файле CSS Я хочу сделать еще один класс CSS .span9? Как мне это сделать?

Причина в том, что элемент DOM использует .span4, и я хочу переопределить это, но он должен быть переопределен в пользовательском внешнем файле CSS.

Возможно ли это?

Answer 1

вы могли бы использовать важную особенность, чтобы изменить все настройки в другом файле, в новом файле вы могли бы сделать что-то вроде этого:

.span9 { 
    width: 800px !important; 
} 

Answer 2

Да, CSS каскадирует (таблица стилей), поэтому просто загружайте изменения после начальных стилей, и он будет работать так, как вы хотите. Если вы хотите переопределить ширину, просто повторно объявите, если вы хотите добавить стили, просто объявите их.

Answer 3

Если у вас есть другая родитель .span вы можете сделать это:

HTML

<div id="parent"> 
    <span class="span9"> Hello world!</span> 
</div> 

CSS

.span9{width:870px;} 
#parent .span9{width:100px;} 

Или вы HTML непосредственно (но это не очень хороший метод)

<span class="span9" style="width:100px!important;"> Hello world</span> 

Answer 4

Да, просто использовать !important. Это переопределит другие правила CSS, которые появятся после него, если они не будут также отмечены как !important.

Таким образом, ваш второй таблицы стилей может содержать что-то вроде

.span9 { 
    width: 1020px !important; 
    } 

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

Answer 5

Вы можете переопределить его, объединив имя тега и имя класса. Например, это: div.span4 будет переопределять простые .span4, посмотрите: http://jsfiddle.net/5dYHG/1/