文章を書く

<!DOCTYPE html>
<html>
  <head>
    <title> タイトル </title>
  </head>
  <body>
  </body>
</html>

前回はこんなHTML文書を書きました。これはbody要素の中に何も書いていないのでページは真っ白です。ここに文章を表示させます。

そうはいっても単純です。次のようにしてみましょう。

<!DOCTYPE html>
<html>
  <head>
    <title> タイトル </title>
  </head>
  <body>
    こんにちは。
  </body>
</html>

こうすると、画面に「こんにちは。」と表示されたはずです。このようにして、ページの中身として文章を表示させることができます。

段落

ところが、このようにbody要素の中に直接文を書くこはよくありません。一般に、文章は段落に分かれています。そして、文章は、文字ではなくその段落の集まりだということができます。

このことをHTMLで表現する方法があります。それがp要素を使う方法です。p要素は段落を意味し、その中に書いた文がその段落に属するということになります。

p要素

子

フレージング・コンテンツ。

意味

段落。

つまり、次のようにします。

<!DOCTYPE html>
<html>
  <head>
    <title> タイトル </title>
  </head>
  <body>
    <p>こんにちは。この段落は1つ目の段落です。</p>
    <p>この段落は2つ目の段落です。</p>
  </body>
</html>

こうすることで、body（文書全体）の中にはp（段落）しか無くなります。

見てみると、段落が変わると行も変わり、2つの段落の間に隙間があると思います。これは、ブラウザがこれらの段落を認識して、段落と段落の間を開けてくれたからです。