будуть відображатися шрифтом "Arial". Якщо він не встановлений на машині користувача, буде використовуватися "Verdana". Якщо недоступні обидва шрифти, для показу заголовків буде використаний шрифт сімейства sans-serif. Зверніть увагу, що ім'я шрифту "Times New Roman" містить приміжки, тому вказано в подвійних лапках.

Властивість font-style визначає стилі normal, italic або oblique. У прикладі всі заголовки

будуть показані курсивом italic.

h1 {font-family: arial, verdana, sans-serif;}

h2 {font-family: "Times New Roman", serif; font-style: italic;}



Властивість font-variant використовується для вибору між варіантами normal і small-caps. Шрифт small-caps використовує малі заголовні букви (upper case) замість букв нижнього регістру, наприклад:



Якщо font-variant має значення small-caps, а шрифт small-caps недоступний, браузер, швидше за все, відобразить текст літерами верхнього регістру.



h1{font-variant: small-caps;}

h2 {font-variant: normal;}

Властивість font-weight задає товщину або жирність шрифту. Шрифт може бути normal або bold. Деякі браузери підтримують навіть числові значення 100-900 (у сотнях) для опису ваги шрифту.

p {font-family: arial, verdana, sans-serif;}

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' - відносні. Багато користувачів не можуть читати дрібний текст, з різних причин. Щоб зробити ваш web-сайт доступним для всіх, ви повинні використовувати відносні значення, такі як '%' або 'em'. Використовуючи скорочену запис font, можна вказувати всі властивості шрифту в одному стилі, наприклад:

p {

font-style: italic; font-weight: bold; font-size: 30px;

font-family: arial, sans-serif;

}

Використовуючи скорочений запис, код можна спростити:

p {

font: italic bold 30px arial, sans-serif;

}

Порядок властивостей font такий:

font-style | font-variant | font-weight | font-size | font-family

2.3 Форматування і установка стилю тексту

Форматування і установка стилю тексту - ключова проблема для будь-якого web-дизайнера. Розглянемо наступні властивості:

• text-indent

• text-align

• text-decoration

• letter-spacing

• text-transform

Властивість text-indent (відступи) виділяє параграф за допомогою установки відступу для його першого рядка. У наступному прикладі text-indent 30px застосовується до всіх параграфів
:

p {

px;

}

CSS-властивість text-align (вирівнювання тексту) відповідає атрибуту, використовуваному в старих версіях HTML. Текст може бути вирівняний left, right, center (по центру) або justify (по ширині).

У прикладі текст заголовків елементів таблиці