Скажем, у меня есть div, в котором используются два класса css, которые используют text-align, но один из них центрирован, а другой выравнивается по правому краю.
Можно ли указать что-то, что даст один приоритет класса другому?
Скажем, у меня есть div, в котором используются два класса css, которые используют text-align, но один из них центрирован, а другой выравнивается по правому краю.
Можно ли указать что-то, что даст один приоритет класса другому?
!important
- это ленивый способ, но вы действительно должны пойти на # 1, чтобы избежать важного принятия. Как только вы добавили один !important
, вы не сможете использовать его, чтобы сделать другое правило еще более важным.
Если вы хотите быть явным, вы можете указать, как комбинация этих двух классов работает вместе, предоставляя правило для элементов, содержащих оба класса. Например, вы можете явно дать что-то с двумя классами foo
и bar
тем же стилем, что и только bar
, как показано ниже. Это работает, потому что .foo.bar
более специфичен, чем просто .foo
для элементов, которые имеют оба класса, и, следовательно, это правило будет иметь приоритет над правилом .foo
.
.foo { text-align: center }
.bar, .foo.bar { text-align: right }
Если вы не хотите, чтобы это было явным, вы можете просто поместить правило для bar
после правила для foo
, поскольку заданы селекторы с той же специфичностью, более поздние правила имеют приоритет над более ранними:
.foo { text-align: center }
.bar { text-align: right }
Вы можете узнать больше о том, как приоритет между правилами определяется в главе спецификации CSS о cascade; что "C" CSS, и важно хорошо понимать, чтобы в полной мере использовать CSS.
Вы должны использовать спецификацию CSS для переопределения предыдущих объявлений http://htmldog.com/guides/cssadvanced/specificity/
p = 1 point
.column = 10 points
#wrap = 100 points
Итак:
p.column { text-align: right; }
могут быть перезаписаны:
body p.column { text-align: left; }