Поскольку оба они имеют одинаковую специфику (только ссылающийся на класс), у одного в конце файла есть прецедент. Если вы сделаете .text_left
be div.text_left
, то он будет более конкретным и переопределит .form_container_header
независимо от того, где он находится в файле.
С W3C :
6.4.3 Расчет специфичности селектора
Специфика селектора рассчитывается следующим образом:
- count 1, если декларация from является атрибутом 'style', а не правилом со селектором, 0 иначе (= a) (В HTML значения атрибута "style" элемента являются правилами таблицы стилей. Эти правила имеют селекторов нет, поэтому a = 1, b = 0, c = 0 и d = 0.)
- подсчитать количество атрибутов ID в селекторе (= b)
- подсчитать количество других атрибутов и псевдоклассов в селекторе (= c)
- подсчитать количество имен элементов и псевдоэлементов в селекторе (= d)
Специфика основана только на форме селектора. В частности, селектор в форме «[id = p33]» считается селектором атрибута (a = 0, b = 0, c = 1, d = 0), даже если атрибут id определен как «ID» "в DTD исходного документа.
Объединение четырех чисел a-b-c-d (в системе счисления с большой базой) дает специфичность.
Некоторые примеры:
* {} /* a=0 b=0 c=0 d=0 -> specificity = 0,0,0,0 */
li {} /* a=0 b=0 c=0 d=1 -> specificity = 0,0,0,1 */
li:first-line {} /* a=0 b=0 c=0 d=2 -> specificity = 0,0,0,2 */
ul li {} /* a=0 b=0 c=0 d=2 -> specificity = 0,0,0,2 */
ul ol+li {} /* a=0 b=0 c=0 d=3 -> specificity = 0,0,0,3 */
h1 + *[rel=up]{} /* a=0 b=0 c=1 d=1 -> specificity = 0,0,1,1 */
ul ol li.red {} /* a=0 b=0 c=1 d=3 -> specificity = 0,0,1,3 */
li.red.level {} /* a=0 b=0 c=2 d=1 -> specificity = 0,0,2,1 */
#x34y {} /* a=0 b=1 c=0 d=0 -> specificity = 0,1,0,0 */
style="" /* a=1 b=0 c=0 d=0 -> specificity = 1,0,0,0 */
<HEAD>
<STYLE type="text/css">
#x97z { color: red }
</STYLE>
</HEAD>
<BODY>
<P ID=x97z style="color: green">
</BODY>
В приведенном выше примере цвет элемента P будет зеленым. Объявление в атрибуте «style» переопределит объявление в элементе STYLE из-за каскадного правила 3, поскольку оно имеет более высокую специфичность.