Типы носителей CSS
Типы носителей в языке CSS
Назначение цвета в CSS
Обычно создавая сайт, рассчитывают на то, что его будут просматривать, через ноутбук или компьютер, у которых имеется клавиатура и мышь. Однако в настоящее время, на сайты всё чаще заходят также через планшеты или смартфоны и если вы хотите чтобы для этих посетителей дизайн сайта изменялся и был более подходящим для сенсорных устройств, то это можно сделать с помощью CSS. (На данный момент статья устарела и подходит только для принтеров и др устройств, если вы хотите создать CSS-код для смартфонов или планшетов, то используйте медиазапросы CSS)
В этой статье мы рассмотрим способы создания CSS-файлов для различных устройств.
| Тип | Описание |
|---|---|
| all | Все типы (устройства). Значение используемое по умолчанию. |
| braille | Устройства основанные по системе Брайля. |
| embossed | Устройства для печати символов Брайля. |
| handheld | Наладонные компьютеры (имеют маленький экран, зачастую черно-белый). |
| Принтеры, предварительный просмотр. | |
| projection | Проекторы. |
| screen | Мониторы компьютеров. |
| speech | Программы воспроизводящие текст в слух, речевые браузеры, речевые синтезаторы. |
| tty | Устройства с фиксированным расстоянием между символами (терминалы, телетайпы). |
| tv | Телевизоры. |
Приведём пример для использования типа устройства print
Создавать отдельный CSS-файл для принтеров, нужно для того, чтобы при выводе веб-страницы через принтер печатался лишь текст статьи, а дизайн сайта и различные элементы сайта не выводились.
Для того, чтобы указать как должна выглядеть страница при отправке её на принтер, нужно в шапку HTML-документа добавить тег <link> с атрибутом media=" " и значением print
<link rel="stylesheet" media="print" href="print.css">
Где атрибут rel="stylesheet" указывает на то, что будет загружаться CSS-файл, а атрибут href="print.css" указывает на имя и адрес CSS-файла.
Помимо тега <link>, атрибут media=" " можно также вставить и в тег <style> или CSS-документ:
@media print {
CSS-код...
}
Если в HTML-документе один из CSS-типов установлен как print, то его можно посмотреть нажав на кнопки меню браузера:
Файл — Предварительный просмотр