HTML・HTMLリファレンス・WEBどうも、ソフトサラダが大好きなユトピ(@yutopi60pa)です。みなさんHTMLのpタグはご存知ですかな?なんとなく文章を囲むときに使うタグだってことはわかると思うけど、詳しいことまでは理解していない人が意外と多いとおみます。まとめpタグとは?pタグはブロック要素で、英語のParagraphの略です。pタグで囲まれた部分は段落として扱われます。段落はそのままの意味ですね。文章のひとかたまりを表すものです。段落1ですぞ!段落1ですぞ!段落1ですぞ!段落1ですぞ!段落1ですぞ!段落1ですぞ!段落1ですぞ!段落2ですぞ!段落2ですぞ!段落3ですぞ!段落3ですぞ!段落3ですぞ!段落3ですぞ!段落1、2、3と三か所のpタグを使いました。今回は分かりやすくするためにcssに背景色とwidthを80%で指定してあります。このようにpタグはブロック要素なので、縦に並んでいきますね。HTML上で長い文章を段落ごとに分けたい場合はpタグで囲んであげるのが適切ですね。/>とは何が違うんでしょうか?こいった疑問を持つ方もいると思います。pタグは囲った文章の後に改行が入りますよね。この特徴を利用して、改行させたい場所に<p>タグを使用する人がいるのですがこれは間違いです。これを使えば好きなところで改行させることができます。pタグの改行は、あくまでブロック要素の特徴と、段落を分けるための改行なんです。レイアウトのためにpタグを使用するのは適切ではありません。/>を使用するのが適切です。/>を使用しています。1段落内での改行のときに使うのが適切ですね。「align」が指定できる!最後に<p>タグには、整列させることができる属性の「align」を指定することができます。両端揃えですぞ!両端揃えですぞ!両端揃えですぞ!両端揃えですぞ!両端揃えですぞ!両端揃えですぞ!両端揃えですぞ!両端揃えですぞ!両端揃えですぞ!両端揃えですぞ!両端揃えですぞ!このように文章の軸を揃えてくれます。「両端揃え」は左右に隙間なく文章を配置してくれます。説明しておいてなんですが、この「align」は実際はあまり使うことはないです。cssに「text-align」という同じようなプロパティがありますので、レイアウトの際はそちらを使っていくことが多いですね。まとめ以上が<p>タグの解説です。SEO意識した文章を書くときは非常に重要なタグですので、しっかりと覚えておきましょう。/>との区別にも注意してくださいね。質問や意見がありましたらお気軽にツイッターの方へどうぞ。コメントをキャンセルメールアドレスが公開されることはありません。