都立町田高校パソコン同好会公式サイト

小さな行李の面々〜主要インラインレベル要素〜

強調を示す要素

文章の中で強調したいところというのがあるものです。この講座でも新しく出てきた要素の名前とかは 強調しています。できるだけ覚えて欲しいですから。文章の中で強調したいところはしっかり強調する、 その方が文章にメリハリがあっていいと私は思います。

そんなわけでHTMLでも強調を示す要素が用意されています。それがem要素です。

記述例

<p>
ガンを治すのではなく<em>消してしまう</em>んです。
</p>

表示例

ガンを治すのではなく消してしまうんです。

em要素はインラインレベルの要素です。ということで記述例のようにブロックレベル要素の中に入っている必要があります。 加えてem要素の中にブロックレベル要素を入れることはできません。

更なる強調を示す要素

強調の要素emよりもさらに強調したいときというのもあると思います。強調にも区別をつけたい場合もあるでしょう。 そんなときに使うのがstrong要素です。

記述例

<p>
ガンを<em>治す</em>のではなく<strong>消してしまう</strong>んです。
</p>

表示例

ガンを治すのではなく消してしまうんです。

em要素と同様にstrong要素もインラインレベル要素です。p要素全体をstrong要素でマークアップなんて 無茶な真似はしないでください。

引用文を示す要素

前回blockquote要素を紹介した折に少し触れましたが、引用文を示す要素としてq要素が用意されています。

記述例

<p>
パスカルいわく<q>人間は考える葦である</q>なんだとさ。
</p>

表示例

パスカルいわく人間は考える葦であるなんだとさ。

前回も述べたとおり、blockquote要素がブロックレベル要素なのに対してq要素はインライン要素です。 そのことを考慮して両者を使い分けるように心がけて下さい。

文章の訂正を示す要素

手書きの文書だったらともかくデジタルの文書に訂正を訂正として記す必要なんてないじゃないか、 訂正したあとの文章に取り替えればいいじゃないか、と思うかもしれません。確かにそういう考え方もあるでしょう。 しかし訂正を訂正として示しておいた方がいいこともあるものです。文書作成者の思考が見えていいじゃないか、 とも考えられますし、どこが訂正されたかが分かりやすいといった面もあります。

そんなこんなでHTMLにも訂正のための要素があります。del要素とins要素です。

記述例

<p>
<del>デカルト</del><ins>パスカル</ins>は人間という存在について「人間は考える葦である。」と述べた。
</p>

表示例

デカルトパスカルは人間という存在について「人間は考える葦である。」と述べた。

del要素は記述した文章を打ち消し、ins要素は新たに文章を挿入します。

del要素はインラインレベル要素ですが、ins要素はインラインレベル要素にもブロックレベル要素にもなります。 ins要素は、中にインラインレベル要素や素の文しか含まないときはインラインレベル要素として振る舞い、 中にブロックレベル要素を含むときはブロックレベル要素として振舞います。加えてins要素は (箱としての親子関係的に)body要素の直下におくことができます。とまぁ例外的な振る舞いをしてくれるins要素ですが、 ・・・出番少ないですね。企業や公共機関の文書でない限りins要素を使う機会には恵まれないですね、やっぱ。

とりあえずかなり雑にインラインレベルの要素に触れました。まぁ強調系の要素を使いこなしてくれれば満足です。 次回はいよいよインラインレベル要素のメイン、a要素とimg要素です。いえーい。


次の講座:08.ハイパーテキストたる所以〜a要素、img要素〜

Copyright© Machida High School Personal Computer Club