<p>HTML предоставляет несколько способов для создания переноса строки. Как правило, мы используем тег <br> или CSS свойство <code>white-space:pre-line</code>. Давайте рассмотрим каждый из них и приведем примеры кода.</p>
<h3>1. Использование тега <code><br></code></h3>
<div class="code">
<pre><code><p>Первая строка<br>Вторая строка</p></code></pre>
</div>
<p>Этот код создаст две отдельные строки внутри элемента <code><p></code>. Результат будет выглядеть примерно так:</p>
<pre><code>Первая строка
Вторая строка</code></pre>
<p>Тег <code><br></code> не требует закрывающего тега, так как это пустой элемент.</p>
<h3>2. Использование CSS свойства <code>white-space:pre-line</code></h3>
<div class="code">
<pre><code><style>
.multiline {
white-space: pre-line;
}
</style>
<p class="multiline">Первая строка
Вторая строка</p></code></pre>
</div>
<p>В этом примере мы создаем класс <code>.multiline</code>, который применяется к элементу <code><p></code>. CSS свойство <code>white-space:pre-line</code> позволяет сохранять все пробелы и переносы строки внутри текста. Результат будет таким же, как и в предыдущем примере.</p>
<h3>3. Использование <code><pre></code> тега</h3>
<div class="code">
<pre><code><pre>Первая строка
Вторая строка</pre></code></pre>
</div>
<p>Тег <code><pre></code> предназначен специально для отображения предварительно отформатированного текста, сохраняя пробелы и переносы строк. Он автоматически создает переносы строк между блоками текста. Результат будет таким же, как и в предыдущих примерах.</p>
<p>Заметьте, что в примерах использованы теги <code><p></code> для демонстрации. Вы также можете использовать переносы строк внутри других элементов, таких как <code><div></code>, <code><span></code> и т. д.</p>
<p>Вот несколько примеров, которые помогут вам лучше понять, как создавать переносы строк в HTML. Надеюсь, данная информация была полезной для вас. Если у вас возникнут еще вопросы, не стесняйтесь спрашивать!</p>