忍者ブログ

World of granshe.

HTMLやCSS、JavaScriptに関する話題を中心に、Web制作について知ったこと、覚えておきたいことをメモしておく個人的スペースです。
[145] [144] [143] [142] [141] [140] [139] [138] [137] [136] [135

[PR]

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

hr要素でコンテンツを区切る理由

たまに、Webサイトの中で、グローバルナビゲーションとコンテンツとフッター部分をhrタグで区切っているサイトが見受けられます。
HTML5では、文章の切れ目、閑話休題的な意味で扱われることになるようですが、
現状のものでは特に明確な意味はなく、「水平線引く」的な扱いだと思います。

使う理由としては、「CSSがなくなったときにコンテンツの区別がつきやすいから」
ということだそうですが、その点は確かに納得。
ただやっぱり、その理由だと、デザインのためにやってるんだよなーこれ、と思ってしまいます。

「コンテンツ同士の区別をつけるため」だと見栄え的な考えかなって気がしますが、
「コンテンツ同士が区切られていることを示す」だとHTML的に良い感じがしますね。
(わかりずらっ)


・・・また変な精神論になってしまいましたが、このhrに関して、
「コンテンツ同士の意味的な区切り」だけじゃない使われ方が紹介されてたのでメモ。


というのも、フロートを解除させるために使っている例もあるんだとか。

例えばグローバルナビゲーションといえばリストタグでフロートというのがほぼ王道ですが、
li要素をフロートさせると、その親要素であるDIVやらulやらに高さを指定してやるか、
clearfixなるおまじないをつけるとか、色々調整しないといけないんですが、
たとえばグローバルナビゲーションボックスの直後にhrを入れて、clear:both;を入れて解除すればいいんでないの。っていうしくみらしいです。

あーそういう使い方があったんだーと、ちょっぴり感動しました。

フロートを解除するためだけにこれ使うのはアウトだとは思いますけど、
せっかくHTMLに書いてるんだしこういう使い方もありなんだーと新鮮に感じました。

PR
この記事にコメントする
お名前
タイトル
文字色
メールアドレス
URL
コメント
パスワード   Vodafone絵文字 i-mode絵文字 Ezweb絵文字
この記事へのトラックバック
この記事にトラックバックする:
プロフィール
名前: ゆーり
職業: コーダー(模索中
趣味: Web制作
自己紹介: 某Web製作会社の入社5年目のマークアップエンジニア。専門はHTMLとCSSとMT(自称)。
カレンダー
02« 2017/03 »04
S M T W T F S
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
ブログ内検索
忍者ブログ [PR]