Текст-обосновка - 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 Docs добавя интервали между думите, за да заемат цялата ширина на документа на всеки ред

В text-justifyимота ни позволява да направим същото, но с допълнителна гъвкавост, за да се определи дали методът на разстояние се използва за оправдаване на съдържанието се управлява между думи и знаци.

Поддръжка на браузър

В text-justifyимота е включен в CSS Текст Модул Ниво 3 спецификация, която в момента е в състояние на чернова на редактора по време на това писание.

Понастоящем това свойство е посочено като „в риск“ от отпадане в периода на препоръка за кандидат. Като такова не се препоръчва използването на това свойство в производството, тъй като е малко вероятно да бъде прието като стандарт за всички браузъри в близко бъдеще.

Текущата поддръжка е ограничена до Firefox 55+. Internet Explorer 11 и Edge 14+ също поддържат свойството, но само inter-wordстойността, както и неофициалните стойности, които не са включени в спецификацията на W3C.

Тези данни за поддръжка на браузъра са от Caniuse, който има повече подробности. Число показва, че браузърът поддържа функцията на тази версия и по-нова.