Как сделать

Как установить оправданный текст с помощью CSS

Одним из свойств типографии веб-сайта, который вы можете настроить при разработке сайта, является обоснованность текста сайта. По умолчанию текст веб-сайта выравнивается по левому краю, и именно столько сайтов оставляют свой текст. Единственные другие варианты оправданы правильно, что является редкостью или полностью оправдано.

Обоснованный текст — это блок текста, который выравнивается как с левой, так и с правой стороны, а не только с одной из этих сторон (что и делают «левые» и «правые» обоснования). Вдвойне оправданный эффект достигается путем корректировки пробелов в каждой строке текста, чтобы обеспечить одинаковую длину каждой строки. Этот эффект называется полным оправданием . Обоснуйте текст в CSS с помощью свойства text-align .

Как работает оправдание?

Причина, по которой вы часто видите неровный край с правой стороны блока текста, заключается в том, что каждая строка текста имеет разную длину. В некоторых строках больше или больше слов, а в других — меньше или меньше слов. Чтобы оправдать этот блок текста, необходимо добавить дополнительные пробелы в некоторые строки, чтобы выровнять все строки и сделать их согласованными.

У каждого веб-браузера есть свой алгоритм применения лишних пробелов в строке. Браузеры смотрят на длину слова, переносы и другие факторы, чтобы определить, где поставить пробелы. В результате выровненный текст может не выглядеть одинаково в разных браузерах. Однако будьте уверены, что основная поддержка браузера хороша для оправдания текста с помощью CSS.

Как оправдать текст

Для обоснования текста с помощью CSS требуется фрагмент текста для обоснования. Как правило, вы будете использовать абзацы текста, потому что большие блоки текстового контекста, которые занимают несколько строк, будут отмечены тегами абзаца.

После того, как у вас есть блок текста для выравнивания, достаточно задать стиль для выравнивания с помощью свойства стиля CSS  text-align . Примените это правило CSS к соответствующему селектору, чтобы получить блок текста для отображения в соответствии с назначением.

Когда оправдывать текст

Многим нравится внешний вид оправданного текста с точки зрения дизайна, в основном потому, что он создает очень непротиворечивый, размеренный вид, но есть и недостатки у полного обоснования текста на веб-странице.

Во-первых, оправданный текст может быть трудно читать. Это потому, что когда вы выравниваете текст, иногда между словами в строке может быть добавлено много дополнительного пространства. Эти противоречивые пробелы могут затруднить чтение текста. Это особенно важно на веб-страницах, которые уже трудно прочитать из-за освещения, разрешения или другого качества оборудования. Добавление необычных пробелов к тексту может ухудшить ситуацию.

Помимо проблем с читабельностью, пробелы иногда выстраиваются в линию друг с другом, создавая «реки» пустого пространства в середине текста. Эти большие промежутки пробелов могут действительно сделать неловкий показ. Кроме того, на очень коротких строках выравнивание может вызвать строки, содержащие одно слово с дополнительными пробелами между самими буквами.

Итак, когда вы должны использовать выравнивание текста? Наилучшее время для выравнивания текста возникает, когда строки длинные, а размер шрифта небольшой — что трудно обеспечить на адаптивных веб-сайтах, где длина строк изменяется в зависимости от размеров экрана. Не существует жесткого и быстрого числа для длины строки или размера текста; Вы должны использовать свое лучшее суждение. 

После применения стиля выравнивания текста для выравнивания текста протестируйте его, чтобы убедиться, что в тексте нет рек пустого пространства, и протестируйте его с различными размерами. Самый простой тест не требует ничего более сложного, чем ваши прищуренные глаза. Реки выделяются белыми пятнами в остальном сером блоке текста. Если вы видите реки, вы должны внести изменения в размер текста или ширину текстового блока, чтобы переформатировать текст.

Похожие посты
Как сделать

Как получить возмещение за покупки в iTunes или App Store

Как сделать

Поверхностное перо не работает? Вот как это исправить

Как сделать

Как настроить и использовать Fire TV Recast

Как сделать

Как изменить рингтон по умолчанию на вашем iPhone