いろいろなブロックレベル要素

目次

• 署名
• 整形済みテキスト

署名

みなさん、作文やレポートなどを書いたら自分の名前を書きますよね。HTML文書でも同じです。誰が書いたものなのかわかるように署名をするようにしましょう。

署名をするときに使うのがaddress要素です。署名を<address>〜</address>で囲みます。これはブロック要素です。

作文やレポートなら名前を書くだけでいいんですが、HTML文書の署名には更新日時や連絡先メールアドレスなども入れたほうがいいでしょう。

<address>
  Copyright &copy; 2005 石川 一靖.<br>
  メール: <a href="mailto:elastic965@gmail.com">elastic965@gmail.com</a><br>
  最終更新日: 2007年3月5日
</address>

ちょっと補足説明をしておきます。©は実体参照です。表示すると © となります。

a要素のhref属性を「mailto:メールアドレス」と書くと、メールアドレスにリンクを張ることができます。クリックするとメーラーが起動すると思います。

ついでに、1行目の「Copyright 云々」は著作権表示です。「この文章の著作権者は私ですよ」と表示しているわけです。ただし、法的には著作権表示がなくても著作権法でちゃんと保護されますので、絶対に必要なものというわけではないそうです。(参考：著作権と「マルＣ」)

整形済みテキスト

整形済みテキストというのは、スペースや改行を入れて、文字通り「形を整えた」文章のことです。例を見てみましょう。

柿食えば
      鐘が鳴るなり
                法隆寺

スペースで字下げして俳句っぽく(？)なっています。これを、pre要素を使って<pre>〜</pre>で囲むと、スペースや改行がそのまま表示されます。

<pre>柿食えば
      鐘が鳴るなり
                法隆寺</pre>

柿食えば
      鐘が鳴るなり
                法隆寺

参考までに、<p>〜</p>で囲むと、連続したスペース・改行はスペース一個分になるので次のようになります。

<p>柿食えば
      鐘が鳴るなり
                法隆寺</p>

時々勘違いしている人がいますが、pre要素はスペースや改行をそのまま表示するだけで、<em>〜</em>で囲んで強調したり、<a href="URL">〜</a>でリンクを張ることができます。

<pre><em>柿</em>食えば
      鐘が鳴るなり
                <a href="http://ja.wikipedia.org/wiki/%E6%B3%95%E9%9A%86%E5%AF%BA">法隆寺</a></pre>

柿食えば
      鐘が鳴るなり
                法隆寺

まとめ

• HTML文章には署名を入れるようにする
• 署名は<address>〜</address>で囲む
• <pre>〜</pre>で囲むと、スペース・改行がそのまま表示される

Information