Текст-виправдання - CSS-хитрощі

text-justifyВластивість в CSS є доповненням до text-alignнерухомості, яка використовується для завдання способу вирівнювання тексту , коли text-alignвстановлений на justifyзначення.

p ( text-align: justify; text-justify: inter-word; )

Цінності

inter-word: Вказує, що текст виправдовується коригуванням інтервалу між словами, ефективно створюючи додатковий інтервал між словами. Це фактично різновид word-spacingвласності.
inter-character: Вказує, що текст просто подається шляхом регулювання інтервалу між символами, ефективно створюючи додатковий інтервал між символами. Це фактично різновид letter-spacingвласності.
auto: Дозволяє браузеру визначити, чи краще обґрунтування обробляється як inter-wordабо inter-character. Це може бути корисним у багатомовних сценаріях, коли мова вмісту невідома до відтворення, що дозволяє користувачеві браузера вибрати відповідний спосіб, виходячи з того, який метод краще відповідає мовному контексту.
none: Вимикає методи виправдання, ефективно вилучаючи будь-які можливості виправдання або перевизначуючи, де метод обґрунтування може мати місце в каскаді.

Що саме є виправданням?

Обґрунтований текст - це вигадливий спосіб сказати, як текст заповнює поле, що його містить. Насправді ви, можливо, вже добре знайомі з обґрунтовуючим текстом і навіть не знаєте його. Якщо ви коли-небудь використовували програмне забезпечення для редагування тексту, як-от Word і Google Docs, можливо, ви знайомі з цими піктограмами:

Параметри вирівнювання та вирівнювання тексту на панелі інструментів Google Docs

Ці перші три встановлюють вирівнювання тексту, як і text-alignвластивість CSS , де текст можна вирівняти ліворуч, праворуч або повністю відцентрувати.

Четверта піктограма є опцією вирівнювання, і вона повідомляє вмісту заповнити всю ширину документа, щоб кожен рядок знаходився на одному рівні прямо до краю, незалежно від того, чи впливає це на інтервал між словами.

Обґрунтовуючи вміст у Документах Google, додає інтервал між словами, щоб зайняти повну ширину документа в кожному рядку

text-justifyВластивість дозволяє робити те ж саме, але з додатковою гнучкістю , щоб визначити , чи використовується метод інтервал , щоб виправдати утримання управляється між словами або символами.

Підтримка браузера

text-justifyВластивість включається в CSS Text Module Level 3 специфікації, яка в даний час в проекті статусу редактора на момент написання цієї статті.

На даний час ця властивість перелічена як "під загрозою" відхилення в період, коли рекомендується кандидат. Таким чином, не рекомендується використовувати цю властивість у виробництві, оскільки вона навряд чи буде прийнята як стандарт у всіх браузерах найближчим часом.

Поточна підтримка обмежена Firefox 55+. Internet Explorer 11 та Edge 14+ також підтримують властивість, але лише inter-wordзначення, а також неофіційні значення, не включені до специфікації W3C.

Дані про підтримку веб-переглядача подані компанією Caniuse, яка містить більше деталей. Цифра вказує на те, що браузер підтримує цю функцію на цій версії та вище.