CSS. Шрифтовое и абзационное оформление Параметры шрифтов Семейство шрифта Свойство font-family указывает приоритетный список шрифтов, используемых для отображения данного элемента или web-страницы. Если первый шрифт списка не установлен на компьютере, с которого выполняется доступ к сайту, ищется следующий шрифт списка, пока не будет найден подходящий. Например: h1 {font-family: arial, verdana, sans-serif;} h2 {font-family: "Times New Roman", serif;} Стиль шрифта Свойство font-style определяет normal, italic или oblique. Например: h2 {font-family: "Times New Roman", serif; font-style: italic;} Вес шрифта Свойство font-weight описывает, насколько толстым, или "тяжёлым", должен отображаться шрифт. Шрифт может быть normal (обычный), bold (полужирный), bolder (жирный). Некоторые браузеры поддерживают числовые значения 100-900 (в сотнях) для описания веса шрифта. Например: td {font-family: arial, verdana, sans-serif; font-weight: bold;} Размер шрифта Размер шрифта устанавливается свойством font-size. Используются различные единицы измерения (например, пикселы и проценты) для описания размера шрифта. Например: h1 {font-size: 30px;} h2 {font-size: 12pt;} h3 {font-size: 120%;} p {font-size: 1em;} 'px' и 'pt' дают абсолютное значение размера шрифта, а '%' и 'em' - относительные. Декоративный текст Свойство text-decoration позволяет добавлять различные "декоративные эффекты". Например, можно подчеркнуть текст (underline), перечеркнуть (line-through) провести линию над текстом (overline). Например: h1 {text-decoration: underline;} Интервал между буквами Интервал между буквами текста можно специфицировать свойством letter-spacing. Значение - нужная величина. Например: h1 {letter-spacing: 6px; } Режимы преобразования текста Свойство text-transform может иметь значения: capitalize (первая буква каждого слова – заглавная), uppercase (все буквы заглавные), lovercase (все буквы строчные). Сокращённая запись Используя сокращенную запись font, можно указывать все свойства шрифта в одном стилевом правиле: p {font-style: italic; font-weight: bold; font-size: 30px; font-family: arial, sans-serif;} Используя сокращённую запись, код можно упростить: p {font: italic bold 30px arial, sans-serif;} Параметры абзацев Отступы Свойство text-indent позволяет выделить параграф с помощью установки отступа для его первой строки. Например: p {text-indent: 30px;} Выравнивание текста CSS-свойство text-align соответствует атрибуту выравнивания. Текст может быть выровнен left, right, center или justify. Например: p {text-align: justify;} Задание к уроку Создать web-страницу graphic.htm с использованием стилей шрифтового и абзационного форматирования. Ввести описание стилей h1, h2, p. Для стиля h1 задать шрифт Verdana, размер – 24 пункта, жирный шрифт, выравнивание по центру; Для стиля h2 задать шрифт Sans-serif, размер – 18 пунктов, жирный шрифт, выравнивание по левому краю; Для стиля р задать шрифт Arial, размер – 14 пунктов, выравнивание по ширине. Примените эти стили к тексту, чтобы отформатировать его по образцу. Образец: Растровая и векторная графика Растровая графика Растровое изображение формируется как матрица точек различного цвета (пикселей), которые образуют строки и столбцы. Каждый пиксель может принимать любой цвет из палитры, содержащей десятки тысяч или даже десятки миллионов цветов, поэтому растровые изображения обеспечивают высокую точность передачи цветов и полутонов. Векторная графика Векторные изображения формируются из объектов (точка, линия, окружность, прямоугольник и др.), которые называются графическими примитивами. Для каждого примитива задаются опорные координаты и цвет.