見出しと段落の設定

エディタを使ったテキストを入力した場合、特に指定しなければすべて段落として扱われますので見出しとして扱いたい文に対しては明示的に見出しを設定する必要があります。ここでは見出しや段落を設定する方法について解説します。

(Last modified: )

見出しや段落の設定手順

新しい記事の作成画面を表示し、例えば次のような文章を入力した場合で考えてみます。

p2-1

特に指定しなれば段落は「段落」として扱われます。実際にどのようにHTML文として処理されるのかを確認するためにエディタの表示方法を通常表示からHTML表示に切り替えてみると、それぞれの段落が<p>と</p>で囲まれていることが分かります。

p2-2

入力したテキストの中で指定した段落を見出しに設定することができます。設定するにはエディタの表示方法を通常表示に戻し、設定してい段落のどこかにカーソルを置いて下さい。今回は上から3つ目の段落にカーソルを置きました。

p2-3

ツールバーの「見出し」ボタンをクリックして下さい。

p2-4

段落に対して設定できる見出しが「大見出し」「中見出し」「小見出し」の3種類から選ぶことができます。(最後の「段落」がデフォルトで設定されている値です)。

p2-5

例として「中見出し」をクリックしてみます。すると先ほどカーソルを置いておいた上から3つの段落が「中見出し」として設定されます。

p2-6

見出しを設定すると実際にどのようにHTML文として処理されるのかを確認するためにエディタの表示方法を通常表示からHTML表示に切り替えてみると、見出しに設定した段落が<h3>と</h3>で囲まれていることが分かります。

p2-7

今回は「中見出し」を設定したため<h3>タグが使われましたが、「大見出し」を設定した場合は<h2>タグ、「小見出し」を設定した場合は<h4>タグが使われます。

ブログ記事の本文の中で見出しを使用したい場合には今回解説した方法で見出しを設定して下さい。

( Written by Tatsuo Ikura )

Profile
profile_img

著者 / TATSUO IKURA

プログラミングや開発環境構築の解説サイトを運営しています。