Кольори

CSS-властивості: розміри, кольори, шрифти, текст, поля, заповнення, границі

Розміри

Розміри в CSS можна задавати в різних одиницях виміри:

• em – поточна висота шрифту

• pt – пункти (друкарська одиниця виміру шрифту)

• px – пік сель

• % – відсоток.

Набагато рідше використовується вказівка розмірів в міліметрах (mm), сантиметрах (cm) і дюймах (in).

Одиниця виміру записується відразу за значенням без пропуску:

TABLE {font-size: 12pt}

Кольори

В CSS колір задається як і в HTML – 6 шістнадцятковими цифрами: по 2 на кожен базовий колір (червоний, зелений, синій). Також можна використовувати стандартні назви кольорів на англійській. Наприклад:

А.content {color: black}

A.menu {color: #3300AA}

Допускається скорочувати шістнадцяткову форму до 3 цифр: запис #3300AA можна замінити на #30A.

Рідше використовується конструкція rgb(.), яка дозволяє задавати червону, зелену і синю компоненти в десятковому або відсотком вигляді:

А.content {color: rgb(0%,0%,0%)}

A.menu {color: rgb(51,0,170)}

URL

URL задаються конструкцією url(…). Наприклад, наступний css-код добавляє фонове зображення для сторінки:

BODY {background-image: url(images/bg.jpg);}

Шрифти

Шрифт – набір зображень букв і знаків. У комп'ютері шрифт представляє собою файл, в якому описано, як повинні відображуватися на моніторі або принтері різні символи: букви, цифри, знаки пунктуації і ін. Часто шрифти містять лише зображення для латинського алфавіту і не має, наприклад, підтримка кирилиці.

Існують unicode-шрифти, котрі містять символи для всіх мов. Основні формати файлів шрифтів: TTF – Truetype і його розширення OTF-Opentype.

Типи шрифтів:

serif – шрифти із зарубками (засічками), наприклад: Times New Roman, Georgia.

sans-serif – рубані шрифти (шрифти без зарубок або гротески), типові представники – Arial, Impact, Tahoma, Verdana;

cursive – курсивні шрифти: Comic Sans MS;

fantasy – декоративні шрифти, наприклад: Curlz MT.

monospace – моноширинні шрифти, ширина кожного символу однакова. Приклади: Courier New, Lucida Console.

Зарубками називають елементи на кінцях штрихів букв. Порівняємо букву шрифту Times New Roman і букву шрифту Arial.

М М

Малюнок 3.1. Порівняння букви М – із засічкою і рубаного шрифту.

Пунктирними лініями обведені зарубки. Використання шрифтів із зарубками полегшує читання тексту з паперу, тому такі шрифти зазвичай використовують для набору основного тексту в книгах. Для web-сайтів основний текст частіше набирають шрифтом без зарубок: Arial, Tahoma, Trebuchet MS, Verdana.

Текст

CSS дозволяє управляти властивостями шрифту і тексту:

font-family – задає зображення шрифту. Можна вказати декілька значень через кому. Браузер перевірить перший шрифт із списку: якщо шрифт встановлений на комп'ютері користувача, то браузер застосує його, якщо немає – перейде до другого шрифту і так далі. Останнім в списку зазвичай вказується загальний тип шрифту serif, sans-serif, cursive, fantasy або monospace.

Приклад: