【初心者必見】HTMLで改行をする方法を徹底解説。改行は ダグだけではない

htmlの改行はどうやってすればいいの？

主流なのは タグを使うことで改行ができるよ！

タグ以外に改行をする方法はあるの？

タグや<pre>タグを使う方法があるよ。

改行の方法が3つもあってどれを使っていいかわからなくなりそうだな。。。

3つの改行方法についてこれから解説していくね！

HTMLで改行を行う方法

今回は下記の3パターンの方法について解説を行っていきます。

<p>改行のテスト<br>改行のテスト<br>改行のテスト<br>改行のテスト</p>

タグは、改行する際に使用します。

改行を行いたい、文字の後ろに を記述することによって改行を行うことができます。

注意点としては、スタイルを調整するために タグを使うことは推奨されいないので、改行が実際にコンテンツの1部（住所など）となる場合に使うことをお勧めします。

<p>改行のテスト</p>
<p>改行のテスト</p>
<p>改行のテスト</p>
<p>改行のテスト</p>

タグはParagraphの略で・・・で囲まれた部分は段落を表します。

意味しては段落を意味するので単に改行をするだけの場合は上記で解説を行った タグを使用することが推奨されています。

<pre>
	改行のテスト
	改行のテスト
	改行のテスト
	改行のテスト
</pre>

「PRE」とは「preformatted text」の略で、<pre>～</pre>で囲んだ整形済みテキストと認識されます。

整形済みのテキストとして認識されるので、改行は改行としてみなされます。

また、ソースコードなどもそのまま表示してくれます。

タグを使うことで改行はできますが、必ず改行されてしまうので画面幅によって変な位置で意図しない改行が入る可能性があります。

See the Pen Untitled by xhisashix (@xhisashix) on CodePen.

意図しないところに改行が入ってしまい見栄えが悪くなるケースがあります。

上記の例でbrタグを連続で使用していましたが、 タグを多用するのは構造上あまり好ましくありません。

改行をたくさん開ける場合は、タグを使うか、CSSで調整するようにしましょう。