Как вывести каждое слово с новой строки

3 сентября 2018

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

Согласитесь, открыть исходный код и проставить тег BR после каждого слова немного скучно. Тем более с обновляемыми темами этот способ не пройдет. Потому что после очередного обновления все изменения, внесенные непосредственно в код темы, просто пропадут.

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

Многие задачи фронтенда чаще всего решаются с помощью одного лишь CSS. В некоторых случаях вкупе с JavaScript. И это самый оптимальный путь.

Чтобы решить нашу задачу и вывести все слова в тексте с новой строки, можно просто задать тексту стиль:

p {
	display: table-caption;
}

И все — никаких BR, никакой магии.

Получать уведомления о новых публикациях удобнее всего в фейсбуке или телеграме.

Иван Данилин

Делаю сайты на Вордпресс с 2008 года, занимаюсь их оптимизацией, беру на поддержку, делюсь опытом в своём блоге.

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