段落を意味する<p>タグの詳細と改行スペースについて | 圧倒的な作業効率と差別化を生み出す!~EFFICIENTアフィリエイト~

エフィシェントアフィリエイト~圧倒的な作業効率と差別化を生み出す!~

EFFICIENTアフィリエイト

段落を意味する<p>タグの詳細と改行スペースについて

<p>タグとはParagraphの略で、<P>~</P>で囲まれた部分がひとつの段落であることを意味します。

段落を意味する<p>タグ

この<p>タグは<P>~</P>で囲まれた部分を
一段落であると言う意味を表すタグになります。
また、一般的には<P>~</P>の前後に1行分改行されます。
<P>テストテストテストテスト</P>
<P>テストテストテストテスト</P>

上記の様な記述をするとPタグ間にスペースが出来き
実際の画面上では以下の様に表示されます↓

テストテストテストテスト

テストテストテストテスト

*スタイルシートの指定等でスペースが空かない場合や広さは異なります。

ワードプレスでは自動で挿入される

ワードプレスの「投稿」や「ページ」の編集画面で作成する記事に対して
この<P>タグは自動で挿入されます。

これは改行した数によって
それぞれ自動で挿入されるタグが異なります。
改行1回⇒<br />タグ
改行が2回以上連続した場合⇒<P>

テストテストテストテスト ←改行
テストテストテストテスト ←改行
 ←改行(改行が2回続いている)
テストテストテストテスト ←改行
テストテストテストテスト ←改行
 ←改行(改行が2回続いている)

上記の様な場合は以下の様なソースは生成されます↓

<p>
テストテストテストテスト<br />
テストテストテストテスト
</p>
<p>
テストテストテストテスト<br />
テストテストテストテスト
</p>

画面上では以下の様に表示されます↓

テストテストテストテスト
テストテストテストテスト

テストテストテストテスト
テストテストテストテスト

尚、記事の編集画面内で改行を2回以上連続で行った場合でも
改行した回数に関係なくPタグが挿入されますので
どんなに編集画面内で改行を繰り返しても
改行した分だけのスペースが空くと言うことはありません。

ただし、特定の段落で通常よりも大きなスペースを空けたい場合は
<p>&nbsp;</p>
と記載する事でもう一段落スペースを空ける事が可能です。

■サンプル

テストテストテストテスト
テストテストテストテスト

<p>&nbsp;</p>

テストテストテストテスト
テストテストテストテスト

上記記載で実際には以下の様なスペースが生まれます↓

テストテストテストテスト
テストテストテストテスト

 

テストテストテストテスト
テストテストテストテスト

*スタイルシートの指定等でスペースが空かない場合や広さは異なります。

尚、この<br />タグや<P>タグの自動挿入は
「投稿」や「ページ」の編集画面で作成する記事のみに適用されている機能です。

よってサイドメニューやテンプレートに直接書き込む場合は
<br />タグ<P>タグ共に自分で書き込む必要があります。
  • Yahoo!ブックマークに登録する
  • はてなブックマークに登録する
  • livedoorクリップに登録する
  • newsingブックマークに登録する
  • del.icio.usブックマークに登録する
  • ニフティクリップに登録する
  • RSSを購読する
  • このページをブックマーク!

次の記事 »
前の記事 »
トップページへ » 圧倒的な作業効率と差別化を生み出す!~EFFICIENTアフィリエイト~

もっと詳しく知りたい事や
理解できなかった事などございましたらお気軽にご連絡下さい。

お問い合わせはこちらからどうぞ

この記事へのコメント

次の記事 »
前の記事 »
トップページへ » 圧倒的な作業効率と差別化を生み出す!~EFFICIENTアフィリエイト~

お問い合わせはこちらからどうぞ

圧倒的な作業効率と差別化を生み出す!~EFFICIENTアフィリエイト~ TOP » <p>タグ(段落を意味するタグ), HTMLタグ辞典 » 段落を意味する<p>タグの詳細と改行スペースについて