Как сделать принудительный перенос текста?

Question

[cracker-test]

Есть несколько слов. Как сделать, чтобы текст после первого слова переносился на новую строчку? Сделать нужно без html т.е br не подойдет.

Comments

[Сергей delphinpro]

никак

[Вадим]

Если там чисто текст, и первое слово ни во что не обёрнуто, то без html или js - никак.

Answer 1

[Dino Winchester]

Если верстка имеет примерно такой вид:

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit</p>

А нужно чтобы было так:

<p>Lorem 
ipsum dolor sit amet consectetur adipisicing elit. </p>

Тогда, увы, но средствами CSS такого эффекта добиться не выйдет. В CSS имеется псевдоэлемент ::first-letter для стилизации первой буквы в строке, но нет псевдоэлемента :first-word, который мог бы дать возможность стилизовать первое слово. Так что как вариант, можно обернуть первое слово в дополнительный тег, например в span через html руками или через JS. После чего станет доступна стилизация первого слова. Ну или всё таки вставить тег br в нужном месте.

Например можно сделать как-то так:

<p class="target">Lorem ipsum dolor sit amet consectetur adipisicing elit</p>

const target = document.querySelector(".target");

target.innerHTML = target.innerText
     .split(" ")
     .map((w, i) => (i > 0 ? w : `<span>${w}</span>`))
     .join(" ");

.target > span:first-child {
  display: block;
}

В результате, все слова идущие после первого слова, будут на новой строке.

Comments

[Антон Литвиненко]

Mizutsune, а я вообще не туда написал, сорян

[Dino Winchester]

Антон Литвиненко, окей.

Answer 2

[Михаил Лялин]

ради "нескольких слов" проще и быстрее через br или столбец ширины слова