Означает ли порядок определения стилей CSS?
У меня есть несколько таблиц стилей. Первый - это таблица стилей с некоторыми стилями, которые я хотел бы использовать как значения по умолчанию. В зависимости от нескольких факторов код, используемый для создания страницы, может содержать некоторые таблицы стилей со значениями, которые должны переопределять значения по умолчанию.
Если я использую это, могу ли я полагать, что значения в таблице стилей по умолчанию будут переопределены значениями из другой таблицы стилей? Я использую селектор классов и переопределяю значения, когда имена совпадают.
<link href="defaults.css" rel="stylesheet" type="text/css"/>
<link href="valuestooverridedefaults.css" rel="stylesheet" type="text/css"/>
Это необходимо для работы со всеми браузерами, включая мобильные. Я бы хотел избежать использования "! Important", если это возможно.
Спасибо!
Ответы
Ответ 1
Существует определенный cascade, в котором стили сортируются и применяются.
Когда декларации имеют одинаковую важность (вес), происхождение и спецификацию, выигрывает последняя декларация. Большинство ответов касаются важности и специфики здесь, но не происхождения.
Вот некоторые очень хорошие слайды о CSS Cascades.
Ответ 2
Если селектора идентичны, последний загруженный имеет приоритет, как если бы вы дважды объявили один и тот же класс в той же таблице стилей.
Ответ 3
Если вы определили стиль для селектора более чем в одном файле css, будет создан стиль из последнего загруженного файла CSS
Ответ 4
Да, так работают стили. Последний выигрывает.
Просто убедитесь, что спецификация таблицы стилей по умолчанию не больше вашего переопределения. И да, избегайте! Важно, если можете. Это просто глупо.
Ответ 5
Если я использую это, могу ли я доверять, что значения в таблице стилей по умолчанию будут переопределены значениями из другой таблицы стилей? я использую селекторов классов и переопределяет значения при совпадении имен.
Ответ "да", как вы отметили, когда селектора второго листа идентичны первым.
Использование !important
будет исключением, поэтому избегайте его, как вы также отметили.
Ответ 6
yep - ключ находится на имени "каскадные" таблицы стилей. Таким образом, встроенный стиль перезапишет стиль, определенный в голове, и стиль в голове перепишет стиль в таблице стилей. Последняя загрузка таблицы стилей может перезаписать стили в предыдущем загруженном файле. Если вы используете что-то вроде firebug или инспектор в хроме, он покажет вам, откуда пришел этот стиль или что он скрыл.
Ответ 7
Простой ответ - да. Любые стили, повторно объявленные далее вниз, будут перезаписывать классы, объявленные ранее в загрузке страницы.
Для этого для работы второе объявление класса должно быть в наследовании.
Классы типа .content {} и .body.content {} могут вести себя по-разному при наследовании стилей.