CSS хаки — продолжение

Когда-то давно мы уже писали про CSS хаки, теперь пришло время обновить свои знания свежей порцией приемов для верстки (не совсем красивых, но иногда все-таки нужных).

В заголовках указаны браузеры, к которым применятся хаки.

Google Chrome и Safari 3.1

body:nth-of-type(1) p {
     color: #333333;
}

Safari

html[xmlns*=""] body:last-child p {
     color: #D50303;
}

Современные браузеры (не IE 7)

html>/**/body p {
     color: #CCC;
}

Safari 3.0 и Opera 9

В Сафари добавлено свойство

device-pixel-ratio

, которое определяет как CSS пиксел относится к пикселу устройства вывода. Например, вот так можно подключить файл CSS только для Сафари:

<link rel="stylesheet" media="screen and min-device-pixel-ratio: 0" href="safari3.css"/>
@media screen and (-webkit-min-device-pixel-ratio:0) {
     p {
         color: #00ff00;
     }
 }

А вот такую запись воспримет и Safari 3.0, и Opera 9.

IE под Маком

/**//*/
селектор { 
     свойство: значение;
}
/**/ 

Opera < 9.5

@media all and (min-width: 0px) {
     html:first-child селектор {
         свойство: значение;
     }
 }

Firefox 1-2

@-moz-document url-prefix() {
     свойство: значение;
}

Заключение

Все хаки мы выкладываем для развития кругозора и ни в коем случае не призываем вас их использовать. Старайтесь верстать без них ;-)




Рекомендуем почитать

 

Добавить комментарий


Ваше имя:


Комментарий:


Введите: Картинка