読みやすくしよう!HTMLで段落や改行をする方法

どうも、りかちゅうです!HTMLを学びたての人からすると<body>要素に何を書けば良いのとなる方もいるのかなと思われます。そうですよね。どんなタグがるのかもわからないとなるとそうですよね。ですので、まずは基礎的なことから話したいと思います。それは段落や改行です。HTMLはサイトの骨組みを作る言語ですから文章か書くものです。となると、見やすいような書き方をした方がいいです。そのためにもまずは段落や改行の仕方が分からないといけないのかなと思います。ですので、この記事にて話したいと思います!

<body>のタグは何を書けば良いの?

初心者の人ほど<body>のタグの中に何を書いたら良いの」となりますよね。結論からいうと、何かしらのタグで囲わなくても<body>タグの中に何を書いてもブラウザ上で表示されます。適当に「あいうえお」と書いてみれば分かります。だから、わざわざ何かしらのタグで囲わなくても表示されるちゃされます。ですが、それではただ文字を打っているだけです。それではサイトを構築することはできません。ですので、何かしらのタグを使って<body>タグの中に要素を作っています。

段落を表示するタグ

このように<body>タグの中にたくさんの要素が入って成り立っています。それで、一番初めに教えるのが段落を表示するタグこと<p>タグです。「paragraph」からきていいて文章のまとまりを表示する時に使います。また、段落の間には少しスペースが出来ます。もし、スペースを無くしたいときはCSSといってカスタムするための言語で調整します。そこらへんは後ほど話しますね。そんなこと文面で言われても分からないって?実際にやってみたものがこちらです!

スペースが出来ているのが分かるかと思われます。

改行をするタグ

このように<p>タグを使って段落を作ります。ですが、もし意味のまとまりとしては同じ段落であったとしても途中で改行した方が見やすい時は改行したいところに<br>タグを使います。<br>タグはbreakの省略だそうです。きっと休憩、中断、切れ目ということを表しているのかもしれません。ちなみに<br>タグは空要素なので終了タグがないです。

文面では完全にはわからないと思うので先ほどの文章でそれをやってみますね。こんな感じです。

<br>のところで改行されているのがわかるかと思われます。

<p>タグと<br>タグの違い

<p>タグと<br>タグも同じ改行と思うかもしれません。私も初めはそのように思いました。ですが、違いはあります。<p>タグで改行する場合は話が変わるときに使います。ですが、<br>タグは同じ話の内で改行します。

まとめ

段落を意味するのが<p>タグで段落の中で改行したいときが<br>タグなのかなと思えばいいです。ここらへんはざっくりと覚えればいいと思います。また、どう言う時に使うかに関しては慣れでしかないです。ですので、自分で工夫しながら意識して使うことをおすすめします。以上です。最後まで読んでいただきありがとうございました。

りかちゅう