Баннер

05
Дек

Перенос слов при создании сайта

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

Тег <wbr>.

Данный тег делает перенос слов там, где это необходимо. Когда слово полностью помещается по ширине, то тег <wbr> никак себя не проявит. Но если места не хватает, то браузер сделает перенос слова в том месте, где указан данный тег.

Мягкий перенос.

Тег <wbr> имеет минус, он заключается в том, что он делает перенос слова таким образом, что потом пользователю бывает затруднительно понять это отдельное слово или продолжение текста. Веб-переносы лучше делать по типографским правилам, а именно, добавляя дефис в конце строчки. Для этого в HTML применяют ­, который по функции схож с тегом <wbr>, но при переносе добавляет дефис.

Свойство word-break.

Для создания автоматического переноса слов используют свойство word-break, в значении которого прописывается break-all. Если в CSS-коде прописать данное свойство, в HTML-код не надо будет добавлять теги для переноса.

Свойство hyphens.

На данный момент это самый удобный способ создать автоматический перенос. Функционирование свойства hyphens основано на том, что в браузере уже есть словарь с соответствующими переносами. Для того, чтобы это свойство заработало, необходимо в теге <html> указать атрибут lang со значением ru. Поддерживается Android, IE10, Firefox, iOS, а не поддерживается в браузерах Opera и Chrome.

Запрет переносов.

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

Профессиональное создание сайтов Харьков доступное для заказа на сайте gunchenko.com, является идеальным выбором для привлечения потенциальных клиентов через глобальную Сеть.

Баннер

Добавить комментарий


Защитный код
Обновить

Баннер

Новости в сети