0

私はマークアップを書いて、次の ように主要なセクションに分割しました:Corpora - A Business Theme



<header>
    <div class="roof"></div>
    <nav></nav>
    <div class="slides"></div>
</header>
<div class="content">
    <div class="roof"></div>
    <aside></aside>
    <div class="main"></div>
</div>
<footer>
    <div class="roof"></div>
    <div class="credit"></div>
</footer>

ページの異なるセクションに同じクラス名を付けても.roofよろしいですか?
[編集] だから、私.roofの のスタイリングが異なることを考えると、私は書かなければなりません

<header>
    <div class="roofHeader"></div>
    <nav></nav>
    <div class="slides"></div>
</header>
<div class="content">
    <div class="roofContent"></div>
    <aside></aside>
    <div class="main"></div>
</div>
<footer>
    <div class="roofFooter"></div>
    <div class="credit"></div>
</footer>

?

4

2 に答える 2

2

例（屋根）のように同じ名前で別のセクションに名前を付けるのは、同じスタイルにするか、同じように見えるようにするまでは問題ありません。

例えば

<header>
<div class="roof"></div>
<nav></nav>
<div class="slides"></div>
</header>
<div class="content">
<div class="roof"></div>
<aside></aside>
<div class="main"></div>

上記のコードでは、ヘッダーセクションのdivはコンテンツセクションのdivとまったく同じになります。

これにさらに追加するには-テーマのマークアップを作成している場合-ベストプラクティスは次のようになります-

  1. グローバルスタイルのクラスを書く

  2. セクション固有のスタイルクラス

例：-セクション固有のスタイリング.header {width：100％; font-family：Ariel; font-size：12px; }グローバルスタイリング.float-right{float：right; }

これで、.headerクラスがヘッダーセクションに固有に使用されます。これにより、そこにあるものを変更するための最大限の制御が提供され、マークアップの他の場所で使用するまで、他のセクションに影響を与えません。

.float-rightクラスは、右側にフロートさせたいhtmldivまたはセクションのどこでも使用できます。

于 2013-02-15T11:36:45.270 に答える
0

意味的にはまったく問題ありません。

2 つ以上のセクションに同じスタイル シートを適用する場合は、すべてのセクションに同じクラス名を付け、その特定のクラスにスタイル シートを定義できます。

例えば

.className{ property:value; }
于 2013-02-15T11:32:03.203 に答える