こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

締切り済みの質問

CSSの使い方の流儀?

先日業者にホームページの作成を依頼したところ、
子孫セレクタを駆使したCSSを使ったページが
できあがってきたのですが・・・
たとえばこんな感じ

<div id="header">
  <div class="block1">
    <span>・・・・・・</span>
    ・・・・・・・
  </div>
  <span>・・・・・・</span>
  ・・・・・・・
</div>
<div id="contents">
  <div class="block2">
    <span>・・・・・・</span>
    ・・・・・・・
  </div>
  <span>・・・・・・</span>
  ・・・・・・・
</div>

これに対して
CSSでこんなスタイルが設定されています(セレクタ部のみ抜粋)

#header .block1
#header .block1 span
#header span
#contents .block2
#contents .block2 span
#contents span

私だったらわざわざ複雑な子孫セレクタを使わずに、
個々にクラスかIDを設定すると思うのですが・・・

また、ただ画像が貼ってあるだけと思ったら、
CSSでspanの背景画像として貼ってあったり、

ただの仕切り線と思ったら、
やはりdivのボーダーラインを使っていたり・・・

こういう作りって一般的なのでしょうか?
あるいは、何か利点があるのでしょうか?
ブログのカスタマイズなどだと、元のHTMLを自分で直せない場合が多いので、
こういうコトをすることが良くある、というのはわかるのですが・・・

あまりにHTMLのタグの構造とCSSが密接に絡んでいて、
ほんの一文追加しようとしただけで苦労していまして・・・
なんでこういう書き方なのかな・・・と、
不思議に思っています。。

投稿日時 - 2007-09-21 09:51:20

QNo.3363522

困ってます

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(3)

ANo.3

ホームページビルダーやDREAMWEAVERとかで、個別になっちゃってるのに気づいてないとかそういうオチじゃない?

投稿日時 - 2007-09-21 14:12:37

ANo.2

子孫セレクタは、
CSSのファイルサイズを減らす意味では効果あると思いますよ。

私は常に、
不要なID、クラスは設定しないようにして、子孫セレクタを使用するようにしています。
そうしないと、CSSはも~IDとクラスで埋め尽くされますから。

画像をspanの背景としている点は、
xhtml strictなら<a><img src="" border="0"/></a>のborderが認められていないなどのWEB標準に配慮している可能性は無いでしょうか?

投稿日時 - 2007-09-21 12:29:37

ANo.1

特に利点は無いように思います。
divのボーダーは画像を作らなくていい分、この方にとっては楽なのかなぁと思います。背景画像は文字をすっ飛ばしてたり(text-indent:-9999;とか?)、テキストが重なる場合なんかで使われたりしますね。

CSSってほんとに人によって書き方が違いますからねー。。
ただいえることは第三者の手に渡ってもわかりやすいCSSであることが大切なのではないでしょうか。そういった点では.block1、.block2は少しわかりにくいので良くないという事が言えると思います。
※.block1、.block2を他のページで使っておられるのかも。。流用できる箇所なのでクラス指定なのかなぁ。。こればっかりは全部総合して見ないとわからないですね。

投稿日時 - 2007-09-21 10:45:06

あなたにオススメの質問