Как растянуть текст по ширине в css
Перейти к содержимому

Как растянуть текст по ширине в css

  • автор:

Как растянуть текст на всю ширину блока?

5b3a1df73775f276405652.jpeg

Есть блок (голубой на картинке) и текст. Как этот текст растянуть на весь блок?

  • Вопрос задан более трёх лет назад
  • 20740 просмотров

1 комментарий

Простой 1 комментарий

SecretBrain

SecretBrain @SecretBrain

Как сделать выравнивание по ширине в css

Для этого нужно использовать свойство text-align с значением justify :

.text-justify  text-align: justify; > 

И потом добавить этот класс, например, тегу p .

 class="text-justify">Текст, который будет выровнен по ширине 

CSS: Выравнивание текста

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

  • left — выравнивает текст по левому краю.
  • right — выравнивает текст по правому краю.
  • center — выравнивает текст по центру.
  • justify — выравнивает текст по ширине, в таком тексте оба конца строки размещаются вплотную к внутренним краям элемента. Пробелы между словами в этом случае корректируются браузером так, что бы длина всех строк была строго одинаковая.

    Название документа   

Пример выравнивания текста

февраль, 2012

Помимо выравнивания текста, для первой строки абзаца был задан небольшой отступ, который визуально добавляет "красную строку" к тексту. Этот эффект очень пригодится на страницах с большими объемами текста, облегчая визуальное восприятие.

Примечание: свойство text-align работает только с блочными элементами, такими как абзац или div, выравнивая внутри них все строчное содержимое, включая изображения. Применение свойства к строчным элементам, таким как ссылка или span, не даст никакого эффекта.

С этой темой смотрят:

  • Отступ текста в CSS
  • Цвет и тень текста в CSS
  • Как изменить шрифт в CSS
  • CSS стиль и размер шрифта
  • Стандартные (безопасные) шрифты

Копирование материалов с данного сайта возможно только с разрешения администрации сайта
и при указании прямой активной ссылки на источник.
2011 – 2024 © puzzleweb.ru | razumnikum.ru

Как растянуть текст по ширине блока?

Каким образом можно решить такую задачу? Есть несколько div в которых лежат 2 текстовые строки «p». Текст в эти строки подставляется динамически пользователем при вводе в input. Шрифт у текста в каждом блоке разный. Размер шрифта в первой строке 25px, в нижней 20. Как сделать так, чтобы ширина текста была одинаковой, но при этом font-size второй строки был всегда меньше размера первой? https://gyazo.com/585a1b62e7338b2f8464c989c18661c2

Отслеживать

5,264 1 1 золотой знак 18 18 серебряных знаков 36 36 бронзовых знаков

задан 1 июн 2018 в 12:16

Александр Пикин Александр Пикин

47 2 2 серебряных знака 9 9 бронзовых знаков

А что вы понимаете под шириной текста? За счет чего текст должен становится шире?

1 июн 2018 в 12:32

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

1 июн 2018 в 12:40

Никак. Я в первой напишу «ШШШШШШШШШШШШШШШШШ», а во второй «i» — и что ты с этим сделаешь?

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

Ваш адрес email не будет опубликован. Обязательные поля помечены *