|
Plati.ru - Магазин цифровых товаров: пин-коды для игр, интернета и IP-телефонии, электронные книги, программное обеспечение, красивые номера ICQ и многое другое. Зайди и убедись сам! |
Медиа типы CSS
Медиа типы позволяют вам указать то, как будет отображаться ваш документ на различных устройствах. Можно задать разный стиль для отображения документа на мониторе, при печати, в голосовых браузерах и т.д.
Медиа типы
Некоторые свойства CSS созданы под определенные устройства отображения веб-страниц. Например, свойство "voice-family" создано для использования в голосовых браузерах. Некоторые свойства можно использовать для разлычных устройств. Например, свойство "font-size" можно использовать как для монитора, так и для вывода документа на печать. Документ обычно имеет больший шрифт на мониторе, чем на бумаге, кроме того шрифты sans-serif лучше читаются с экрана, а для печати лучше подходят шрифты serif.
Правило @media
Правило @media позволяет нам назначать различные стили для разных устройств в пределах одной таблицы стилей.
Следующий css-код указывает браузеру, что он должен отображать текст на мониторе размером 14 пикселей шрифтом Verdana. При печати шрифт будет размером 10 пикселей, шрифт поменяется на Times. Не забывайте о том, что жирность шрифта остается одинаковой и на мониторе, и при печати:
<html>
<head>
<style>
@media screen
{
p.test {font-family:verdana,sans-serif;font-size:14px;}
}
@media print
{
p.test {font-family:times,serif;font-size:10px;}
}
@media screen,print
{
p.test {font-weight:bold;}
}
</style>
</head>
<body>
....
</body>
</html>
Различные медиа типы
Заметка: названия медиа типов не чувствительны к регистру.
| Название | Описание |
|---|---|
| all | Все типы устройств и программ |
| aural | Голосовые браузеры |
| braille | Устройства со шрифтом Брайля |
| embossed | Принтеры со шрифтом Брайля |
| handheld | Мобильные устройства и КПК |
| Принтеры | |
| projection | Проекторы и слайдеры |
| screen | Мониторы |
| tty | Телетайпы |
| tv | Устройства телевизионного типа |
