あんまり知らないけど便利なタグ達。

このエントリーをはてなブックマークに追加

XHTMLの構造化を考えると文章に意味を持たせる為のHTMLタグは必要不可欠です。

覚えても普段使わないとすぐ忘れます。

忘れた時はこのページを見に来てください。

del
視覚的には取り消し線が表示されます。
意味的にはその内容を削除された物として扱います。
こんなかんじ

ins
視覚的には下線が表示されます。
意味的にはその内容を追加された物として扱います。
こんなかんじ

em
視覚的には斜体で表示されます。
意味的にはその内容を強調されたものとして扱います。
(よく使われるstrongはより強い強調として扱われます)
こんなかんじ

blockquote
視覚的には上下左右に余白が挿入されます。
意味的には引用文として扱われます。

こんなかんじ

q
視覚的には左右にダブルクウォーテーションが挿入されます。
意味的には引用文の一部として扱われます。
こんなかんじ

abbr
視覚的にはマウスオーバー時にtitle属性に設定している文字列をツールチップ(小見出し)として表示します。
意味的には略語(XHTMLCSSなどスペルごとに区切って発音される物)として扱われます。
こんなかんじ

acronym
視覚的には下線として点線が表示され、マウスオーバー時にtitle属性に設定している文字列をツールチップ(小見出し)として表示します。
意味的には略語(LANNATOなど頭字語として発音される物)として扱われます。
※実際問題頭字語で発音される例文を探すのに困難するくらいレアな使い方です。
こんなかんじ

pre
視覚的には(X)HTMLソース中のスペースや改行をそのまま表示します。
意味的には整形済みテキスト(?)らしいです。よくわかります。後述するcodeタグと合わして本当の利用価値を発揮します。

こんな
         かんじ

code
スクリプトなどをブラウザ上に表示する時に使用します。
意味的にはずばりコード(スクリプト)です。

fieldset
フォームの入力項目をグループ化する際に使用します。

legend
fieldsetでグループ化されたものに対してタイトルを付けます

使用例(html)

<fieldset>
<legend>タイトル</legend>
こんなかんじのなかみ
</fieldset>

使用例(ブラウザ)

タイトルこんなかんじのなかみ

随時追加していくってことで

スポンサードリンク

«ウェブ進化論 本当の大変化はこれから始まる | メイン | Movabletypeの設置方法»

このエントリーのトラックバックURL
http://blog.webcreativepark.net/cgi/mt/mt-bt.cgi/1470
コメントを投稿