Skip to main content

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

Как запретить выделение текста html/css (Апрель 2025)

Как запретить выделение текста html/css (Апрель 2025)
Anonim

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

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

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

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

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

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

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

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

text-align: justify;

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

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

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

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

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

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

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

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