This page has been robot translated, sorry for typos if any. Original content here.

форматування тексту

форматування тексту

При заповненні Web-сторінок з форматуванням тексту в html доводиться стикатися більше, ніж з іншими елементами і якби не стилі, це заняття носило довгий і монотонний характер. Каскадні листи стилів з їхньою останньою специфікацією CSS 2.0 можуть задати тексту будь-які параметри форматування. Хоча існує багато підручників на цю тему, але можна підійти більш просто до цієї теми. Отже ...

Так за допомогою властивості family мови HTML можна вказати гарнітуру шрифту. У значеннях ставиться назва шрифту або краще їх перелік в порядку пріоритетності. Можна в значеннях застосовувати класифікації шрифтів: serif (із зарубками), sans-serif (без зарубок), monospase (моно), cursive (похилий), fantasy (довільний).

Font-size - встановлює розмір шрифту в html. У значеннях можна вказати як числові значення в одиницях виміру, так і скористатися ключовими словами:

  • Medium - в його значенні встановлюється розмір шрифта.
  • small - на 20% менше, ніж medium;
  • x-small - на 20% менше, ніж small;
  • xx-small - на 20% менше, ніж x-small;
  • large - на 20% більше, ніж medium;
  • x-large - на 20% більше, ніж large;
  • xx- large - на 20% більше, ніж x-large.

По зображенню шрифт буде змінюватися в HTML за допомогою властивості font-style і його значень: normal (за замовчуванням), italic (курсив), oblique (похилий). За товщиною шрифт регулює властивість font-weight з значеннями normal (за замовчуванням) і bold (напівжирний). Висоту малих літер формує - font-size-adjust, а при значенні small-casp в іншому властивості font-variant шрифт буде прописних, а розмір мати як рядковий.

Інтервали між символами визначаються властивістю letter-spacing, які вимірюються в (em). Інтервал між слів показує - word-spacing. За допомогою text-transform відбувається зміна регістру за допомогою значень: capitalize (перші букви всіх слів будуть великі), lowercase (надає символам рядковий вид), uppercase (формує прописні символи).

При вирівнюванні тексту на сторінці, за допомогою html і css застосовується властивість text - align зі значеннями left (по лівому краю), right (по правому), center (по центру), justufy (по ширині сторінки). По вертикалі ж вирівнювання тексту може відбуватися тільки в таблиці із зазначенням vertical- align при значеннях top (по верху), bottom (по низу), middle (по середині).

При вказівці відстані між рядків Вам знадобиться використовувати властивість line-height, значення якого можуть вимірюватися в будь-яких доступних одиницях, а також у відсотках. При незначних відступу для початку абзацу знаходить застосування вже text-indent, з такими ж значеннями.

Форматування прогалин відбувається за участю властивості white-space і трьох його значень: normal (символи кількох прогалин перетворюються в один), pre (НЕ будуть перетворені в один), nowrap (текст буде перенесений спеціальними тегами).

Text-decoration створює додаткові атрибути до тексту у вигляді підкреслення (underline), перекреслення (line-through) і надкресленням (overline).

За допомогою CSS можна форматувати і списки, незалежно від їх різновидів. У значеннях властивості list-style-type можна вказувати наступне:

  • disk, circle, square - маркер у вигляді закрашеного кола, кола та закрашеного квадрата відповідно для того чи іншого списку.
  • lower-roman і upper-roman - нумерація списку римськими цифрами малими і великими розмірами відповідно для прменяются списку.
  • lower-alpha і upper-alpha - нумерація малими та великими латинськими літерами.
  • decimal - нумерація списку, за допомогою CSS, арабськими цифрами.
  • none - ні нумерації і маркерів для списків.

Властивість list- style -image дозволяє невелике зображення використовувати в якості маркера. Для цього задається потрібно задати його адресу і ім'я. Приклад: list-style-image: url (адреса / ім'я файлу)

Відступ від країв регулюється властивістю list- style -position за допомогою значень inside (збільшити) і outside (зменшити).

Якщо Ви досить засвоїли всі деталі підручника щодо форматування тексту, то запустіть на своєму "компі" будь-який HTML-редактор. Знайдіть там CSS і приступайте від навчання до практичних занять.