Подборка CSS-хаков для различных браузеров
Тонкая настройка CSS в различных браузерах
В Internet есть много статей, посвященных вопросу "to hack or not to hack". Я не хочу обсуждать этот "извечный вопрос", только замечу: что бы там ни говорили противники хаков, хаки весьма и весьма популярны (к счастью или сожалению). Я решил сделать небольшую подборку CSS-хаков для различных браузеров. По сути дела, эта статья является компиляцией очень [...]
← Вернуться к полной версии записи «Подборка CSS-хаков для различных браузеров»…
Автор: Vladimir; опубликовано в: CSS; метки: CSS, хак24
Мар
2008
Мар
2008
Комментарии к статье «Подборка CSS-хаков для различных браузеров» (7) »
Пожалуйста, не используйте эту форму для комментирования! Данная форма предназначена исключительно для ботов.
Оставить комментарий к записи «Подборка CSS-хаков для различных браузеров»
गते गते पारगते पारसंगते बोधि स्वाहा
Меня зовут Владимир, я программист-фрилансер, специализирующийся на Web-программировании и програмировании под Linux.
По совместительству занимаюсь администрированием LAMP/LNMP-серверов и техническим переводом.
[...] Подборка CSS-хаков для различных браузеров. [...]
В дополнении к “Поддержка CSS-селекторов различными браузерами” посмотри сайт http://www.webdevout.net/browser-support-html поддержка CSS1 – CSS3, HTML/XHTML и т.д. может заинтересует…
Спасибо за подборку.
Николай, большое спасибо! Кстати, я видел эту страницу…
Теперь немного экзотики.
Хаки:
div {
background: red;
width: 200px;
height: 30px;
color: #FFF;
}
body:last-child:not(:root:root) div.div1 { background: green; }
html:not(:nth-child(1)) div.div2 { background: yellow; }
@media all and (min-width: 0px) {
body:not(:root:root) div.div3 { background: cyan; }
}
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
div.div4 { background: blue; }
head ~ body div.div5 { background: black; }
:root div.div6 { background: silver; }
}
@media all and (-webkit-min-device-pixel-ratio:10000) {
div.div7 { background: fuchsia; }
}
Разметка:
<div class="div2">Come here, go there, try another one</div><br/> <!-- Safari 3.1, Safari 4.0/WinXP, Konqueror 3.5 -->
<div class="div3">Come here, go there, try another one</div><br/> <!-- Safari 3.0, Safari 3.1, Safari 4.0/WinXP -->
<div class="div4">Come here, go there, try another one</div><br/> <!-- Opera 9.23-27, Opera 9.50 -->
<div class="div5">Come here, go there, try another one</div><br/> <!-- Opera 9.23-27, Opera 9.50 -->
<div class="div6">Come here, go there, try another one</div><br/> <!-- Opera 9.50 -->
<div class="div7">Come here, go there, try another one</div><br/> <!-- Opera 9.23-27 -->
Тестовая страница
Результат на browsershots.org
Trident IV (IE6) ???
Что-то не так?
[...] В этой статье можно ознакомится с CSS-хаками для Gecko, Trident…. [...]