CSS только для Mozilla (в том числе — FireFox)
У верстальщиков до сих пор возникает задача — подключить стили только для определённого браузера. Для IE проблема решаема — всё меньше верстальщиков не знают что такое conditional comments. Но исчезающе малое количество народу знает что такое per-site user stylesheet rules. Интересны они тем, что Mozilla FireFox поддерживет их через собственное правило — «@-moz-document».
Вообще, это правило позволяет подключать стили в зависимости от домена, URL или его префикса. Для нас важно, что эти правила увидит только FireFox.
Простой пример использования, из которого становится понятен общий принцип:
<style type="text/css">
body { background: white; color: black }
@-moz-document url-prefix()
{
body { background: grey; color: white }
}
</style>
<body>White in FireFox</body>Принципы фильтрации по URL и доменам так же могут оказаться полезными, о них можно почитать в архиве W3C.
гм
насколько я помню, conditionas comments не проходят валидацию
а как с этим делом у мозилловской штуки?
Комментарий для perlexeded.livejournal.com:
Conditional comments валидацию, конечно же, проходят. Насчёт этой штуки — не знаю.
<a href=» http://jigsaw.w3.org/css-validator/validator?uri=http://elv1s.ru/x/s/bolknote.ru/moz.css%22%3E%D0%9D%D0%B5 валидно</a>, конечно, как и любой -moz-.
Комментарий для elv1s.ru:
Для меня валидность — не определяющая цель, но для многих важно, да, как приверженность к какой-то тусовке.
Комментарий для elv1s.ru:
Кстати: http://www.w3.org/TR/CSS21/syndata.html
should have one of the following formats:
’-’ + vendor identifier + ’-’ + meaningful name
’_’ + vendor identifier + ’-’ + meaningful name
For example, if XYZ organization added a property to describe the color of the border on the East side of the display, they might call it -xyz-border-east-color.
Other known examples:
-moz-box-sizing
-moz-border-radius
-wap-accesskey
Комментарий для Евгения Степанищева:
Да, я в курсе.
На счёт валидности в CSS всё не так однозначно. «-${&}{@#@» и «opacity: .5» не валидны, а эффект разный.
А тут в комментариях ссылки вставляются только тупо текстом?
Комментарий для elv1s.ru:
Ссылки не вставляются, зачем тут ссылки? opacity — валидно, просто текущий валидатор поддерживает CSS2.1, а opacity — CSS3.
Комментарий для Евгения Степанищева:
Чтобы не выделять ссылку и жать «Go to Web Address».
Валидатор говорит: «Property opacity doesn’t exist in CSS level 2.1 but exists in [css3]».
Тогда можно сказать, что и @-moz-document валидно, просто текущий валидатор не поддерживает это специфичное Gecko-правило :-)
Кстати, зачем здесь надпись «Ответить» картинкой сделана? Мне шрифт без сглаживания глаза режет.
Комментарий для elv1s.ru:
Ну, для at-rule не определены правила создания собственных наименований, так что не валидно.
А чем его ещё писать? Шрифта подходящего нет. А почему режет? Монитор CRT? На всех LCD, которые есть в округе, это смотрится хорошо. На хорошем CRT, который стоит дома в Казани — тоже хорошо.
Комментарий для Евгения Степанищева:
По поводу валидности. Я использую -o-link, -moz-border-radius, -webkit-transition и меня не огорчает то, что это не валидно. Браузер, не поддерживающий эти свойства, просто проигнорирует их.
LCD монитор у меня. Дело не в мониторе, а в том, что шрифт без сглаживания. Я бы написал тупо Ариалом. Хотя ладно, не важно.
Комментарий для elv1s.ru:
Лично меня тоже не огорчает, что это не валидно. Ариал намного шире, а это очень хороший шрифт, не всей графике нужно сглаживание.
Комментарий для Евгения Степанищева:
Евгений, вы просто бог!
body { background: grey; color: white }
этот код просто спас меня от нервного срыва, спасибо огромное ))))
Комментарий для Елена:
И это хорошо :)
sps pomoglo
Спасибо, пригодилось)