Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Практикум зі створення WEB.doc
Скачиваний:
31
Добавлен:
10.11.2019
Размер:
2.35 Mб
Скачать

2. Властивості шрифтів

Властивості, що вводяться аркушами стилів, умовно можна розбити на групи, наприклад, група властивостей тексту або група властивостей шрифтів.

Розглянемо коротко властивості шрифтів:

  • font-family - задає гарнітуру шрифту, що буде використана для виводу тексту. Значенням цієї властивості може бути назва конкретного шрифту (наприклад, Arial) або назва сімейства шрифтів. У специфікації CSS передбачені наступні сімейства: serif (наприклад, Times New Roman, Bodoni), sans-serif (наприклад, Arial, Future), cursive (наприклад, Caflisch Script), fantasy (наприклад, Alpha Geometrique), monospace (наприклад, Courier New). При визначенні властивості font-family можна вказувати список шрифтів, розділених комами, аналогічно тому, як це робиться при завданні атрибута face;

  • font-size - визначає розмір шрифту. Значення розміру може бути задане в абсолютних одиницях (наприклад, l0pt, 8mm, 2in), у відсотках від основного шрифту (наприклад, 130%), а також за допомогою розмірних вираpазів: хх-small (надмілкий), х-small (дуже дрібний), small (дрібний), medium (середній), large (великий), х-large (дуже великий), хх-large (надвеликий), larger (більше), smaller (дрібніше);

  • font-style - задає стиль виводу символів. Можливі наступні значення цієї властивості: normal (звичайний), italic (курсив) і oblique (похилий);

  • font-weight - назначає ступінь «жирності» шрифту. Для цього використовуються цілі числа з діапазону від 100 до 900 із кроком 100 одиниць або ключові слова: bold (жирний), bolder (більш жирний) і lighter (більш тонкий);

  • font-variant - указує варіант накреслення поточного шрифту. Для цієї властивості браузери підтримують два значення: small-caps (відображення малими прописними буквами) і normal (не впливає на відображення).

  • font - «узагальнююча» властивість шрифту, у якій може бути зазначене значення будь-якого атрибута шрифту (font-family, font-size, font-style і т. ін.). Для цього значення властивостей упорядковуються у вигляді послідовності.

Приклади завдання властивостей шрифту:

Р { font-family: helvetica, arial}

STRONG { font-size: 150%}

DIV.imono {font-family: monospace; font-size: larger; font-variant: small-caps}

Найменування властивостей не чутливі до реєстру символів. Однак звичайно використовують рядкові символи, як це прийнято в специфікації CSS.

3. Властивості тексту

Такі властивості, як міжрядковий інтервал, відстань між словами й буквами, називають властивостями тексту. Властивості тексту визначаються для абзаців , навіть, для всього документа, тобто задаються на рівні блоків (Р, DIV, BODY). Але ці властивості можна задавати й для окремих слів або декількох букв, тобто на рівні строкових елементів (SPAN, STRONG і ін.). Нижче перелічені основні властивості тексту, передбачені специфікацією CSS.

  • letter-spacing - установлює відстань між буквами (міжсимвольний інтервал). За замовчуванням цій властивості привласнюється значення normal. Можна також указувати відстань у будь-яких абсолютних одиницях (див. таблицю 1);

  • word-spacing - установлює відстань між словами. Аналогічно letter-spacing значенням цієї властивості за замовчуванням уважається normal. Інші значення можуть бути задані в абсолютних одиницях (наприклад, 10рх, 2mm);

  • text-indent - задає відступ першого рядка абзацу («новий рядок»). Ця властивість застосовується до блоків, і його значення виражається в абсолютних одиницях (наприклад, 4mm, lcm, 20pt і т.д.) або у відсотках від ширини блоку (наприклад, 5% або 10%). За замовчуванням значення властивості text-indent дорівнює нулю. Якщо цій властивості привласнити негативне значення, то замість абзацного відступу одержимо виступ першого рядка;

  • text-align - задає горизонтальне вирівнювання для тексту, розміщеного всередині елемента (наприклад, Р або DIV). Ця властивість приймає значення: center (по центру), left (уліво), right (вправо) і justify (за шириною). За замовчуванням текст вирівнюється по лівому краю. Ефект вирівнювання особливо помітний при великому розмірі шрифту й малій ширині вікна браузера;

  • vertical-align - установлює розташування тексту й малюнків по вертикалі щодо базової лінії. Властивість може приймати, наприклад, наступні значення: baseline (вирівнювання по базовій лінії, приймається за замовчуванням), sub (вирівнювання по лінії нижнього індексу), super (вирівнювання по лінії верхнього індексу);

  • line-height - визначає міжрядковий інтервал. Значення цієї властивості можна задавати в абсолютних одиницях (наприклад, 16pt, 3mm), у відсотках (130%), а також кількістю рядків (наприклад, 1.7 або 3).