Блог

Главная - Вопросы по программированию - Перевод строки (перевод строки) после редактируемого содержимого div

Перевод строки (перевод строки) после редактируемого содержимого div

#html #css

#HTML #css

Вопрос:

Как можно вставить новую строку (разрыв строки) после первой строки текста в contenteditable div , чтобы при фокусировке элемента курсор находился в начале следующей строки?

Кроме того, по крайней мере, Firefox и Chrome переносят существующее содержимое и добавленный текст в дочерние разделы после нажатия Enter (Return), устраняя вставленный <br> .

 div{border:solid 1px black;}
.b {
  white-space: pre-wrap;
  height: 3em;
} 
 <div class="b" contenteditable>nothing</div>
<div class="b" contenteditable>br<br></div>
<div class="b" contenteditable>two brs<br><br></div>
<div class="b" contenteditable>linebreak
</div>

<div class="b" contenteditable>two
lines
</div>

<div class="b" contenteditable>nobreakspace after linebreak
amp;nbsp;
</div>

<div class="b" contenteditable><div>childdiv inherits, with br</div><br>
</div>

<div>
<div contenteditable>work</div>
<div class="b" contenteditable></div>
</div>

Документы:

Ответ №1:

Я нашел решение при работе с фрагментом кода: используйте два разрыва строки, <br><br> .

Работает в Firefox 94.0.2 и Chrome 96.0.4664.93 в Windows 10.

Метки: ,