pタグだと空白が多いなあと思い、spanタグに変えると空白がないので、気になって調べました。
pタグ
pタグは簡単にいうと段落を表すタグです。
改行された後に1行空白が入るのが特徴です。
HTMLリファレンスの例が参考になると思います。
今思えば、だから変な空白(空行)が入っていたんですね！
spanタグ
一方、spanタグは特に何かを表すタグではなく、どこか一部のデザインを変えたいときに使います。
一般的にspanタグでは文章の一部を変更したいときに使います。(文章の一部の色を変えたいなど)
さらに、pタグと違い、空白はありません。
私が開発していたときにはspanを使えばよかったのです。
これが大まかな違いですが、なんか味気ないなあと思っちゃったので、少し関連するdivタグも絡めて書きたいと思います。
ついでにdivタグ
divタグは段落を表すタグです。
特徴としては、空白は入らないが、前後に改行が入るということです。(下記が例です)
<div>aaa</div><div>bbb</div><div>ccc</div> // このように表示される aaa bbb ccc
divタグとspanタグには大きな違いがあります。
それは、divタグはdisplay: blockに対して、spanタグはdisplay: inlineなんです。
divタグは高さや幅が決められて、spanタグは設定できません。
これで、どこでどのタグを使うか少しはわかったと思います。
今まで、感覚でやってきた部分もあるので、調べてみて使いどころが少しは理解できた気がします。
