Як налаштувати міжрядковий інтервал в CSS?

Текст на сьогоднішній день все так же є основним видом переданої інформації на просторах Всесвітньої павутини. Тому управлінню його зовнішнім виглядом приділяється окрема увага. Однією важливою характеристикою тексту є міжрядковий інтервал, який визначає відстань між рядками. Якщо ви ніколи не зустрічалися з цим правилом, то напевно ніколи не працювали з CSS. Адже саме ця мова стилів надає доступні команди для зміни всіх важливих зовнішніх характеристик тексту. Таке правило підтримується всіма сучасними браузерами і входить в стандарт всіх версій таблиць стилів (CSS: Cascading Style Sheets).

міжрядковий інтервал

Правило

У CSS міжрядковий інтервал встановлюється за допомогою простої команди line-height. Запис проводиться у звичайному порядку. Як значення можна призначити будь невід'ємне число. Якщо буде вказано: «line-height: -4px-», то команда буде проігнорована. Можна вказати значення: «normal» або «inherit». Перше буде використовувати автоматичне налаштування інтервалу, що визначається залежно від типу і розміру вибраного шрифту. У цьому випадку відстань між рядками встановлює сам браузер. Міжрядковий інтервал може приймати значення, успадковане у тегів «батьків» за допомогою значення «inherit».

css міжрядковий інтервал

Значення

Всі значення, відмінні від стандартних команд, можна розділити на дві категорії: відносні і абсолютні. Міжрядковий інтервал CSS дозволяє гнучко управляти відстанню між рядками, використовуючи різні і більш зручні способи налаштування. До абсолютним значенням відносять всі відомі одиниці довжини, які застосовуються в CSS. У цей список входять: in (дюйми), pt (пункти), px (пікселі) та інші. Відлік інтервалу проводиться від базової лінії шрифту. Якщо записати правило: «line-height: 10px-», то межстрочное відстань буде завжди дорівнювати 10 пикселям. Такий спосіб ідеально підходить, коли необхідно вказати точну інтервал для певного шрифту. Але не забувайте, що у всіх різне розширення екрану. І якщо у вас така відстань виглядає відмінно, то це не означає, що у всіх буде такий же ефект. Наприклад, на мобільних пристроях великий міжрядковий інтервал може викликати величезні незручності.

міжрядковий інтервал css

Відносні величини

Для вирішення проблеми з різним розширенням екрану можна використовувати відносні величини. Найчастіше використовується процентне вираження. Значення в такому випадку встановлюється щодо висоти шрифту. Наприклад, вказавши «line-height: 150% -», ми отримаємо інтервал, наполовину більший середньої букви. За 100% приймається висота використовуваного шрифту. Більшість опитаних розробників рекомендують використовувати саме відносні величини. Так ви позбавите себе і своїх користувачів від проблем, пов'язаних з різним розширенням екрану.

Висновок

Якщо ви використовуєте нестандартний набір шрифтів, і вам важливий саме строго певний міжрядковий інтервал, вибирайте абсолютні значення. У всіх інших випадках бажано встановлювати процентне властивість. Коли потрібно зробити індивідуальне інтервал для окремої ділянки документа, скористайтеся id-мітками, або селекторами. Таким чином, вам не потрібно буде встановлювати межстрочное відстань для всього документа.