css_test

HTML要素自体にCSSを適用する

HTMLのスタイルシートについて、今までHTML要素とbody要素には特にスタイルシートを設定することは意図的に避けていたが、適用するとまずいこととかあるのだろうか。そういうことをしている人があまりいないというのもあって、そういうものというかbody要素の中の要素に対してだけスタイルシートを当ててデザインするのが当たり前だと思っていた。body要素にはせいぜいmargin:0;padding:0;という設定をするぐらい。

で、HTML要素とBody要素にcssを適用してレイアウトしてみたらどうなるか試してみた。


<html>
<head>
<title>css テスト</title>
<style>
html{background-color:#000;padding:0;margin:0;}
body{background-color:#fff;width:700px;margin:20px auto;padding:0;}
h1{background-color:#ccc;}
</style>
</head>
<body>
<h1>CSS テスト</h1>
</body>
<html>

テストしてみたところ、上の画像とソースのように特に問題はなさそうに見える。これでいいのなら今度からhtmlt要素とbody要素にもcssを適用していこうかと思う。div要素が一つ減らすことがきてソースが簡潔になるし。ただやってる人がいなさすぎて大丈夫かなというのはあるが、多分大丈夫だろう。

コメントを残す

メールアドレスが公開されることはありません。