0

私はこのようなデザインを持っています:

<body id="layout">
 <div id="section-header">
   <div class="widget" id="Pagelist1">
    <div class="widget-wrap1">
     <div class="widget-wrap2">
        <div class="widget-content">
        </div>
     </div> 
   </div>
   </div>
   <div class="widget" id="Pagelist2">
    <div class="widget-wrap1">
     <div class="widget-wrap2">
        <div class="widget-content">
        </div>
     </div> 
   </div>
   </div>
 </div>
</body>

要件: CSS は常にbody#layout
How can I style for widget-contentclass (child of Pagelist2ID)?で始まります。
私はこのようにスタイリングしようとしましたが、うまくいきません：
body#layout > #Pagelist2 > .widget-content {....}

クラスをスタイリングしたい.widget-content

4

4 に答える 4

1

子セレクター を使用してい>ます。

body#layout > #Pagelist2 > .widget-content

CSS は、 の直接の子である の直接の子であるすべての要素のスタイルを設定します.widget-contentが、HTML マークアップにこのチェーンがありません。#Pagelist2body#layout

あなたが望むセレクターは

#Pagelist2 .widget-content {...}

しかし、私のはbody#layoutどこですか？

id セレクターの仕様でわかるように、ページには 1 つしか有効にできないため、これは必要ありません。 #Pagelist2

于 2013-10-08T12:20:50.523 に答える
1

また

#layout  #Pagelist2 .widget-content {....}

あるいは単に

#Pagelist2 .widget-content {....}

子セレクターを使用していて#Pagelist2、ボディの直接の子ではないため、うまくいきませんでした。

于 2013-10-08T12:14:21.263 に答える
-1

「>」は一部の古いブラウザでは完全にはサポートされていません。だからあなたはそれを落とすことができます。

構造体の絶対パスを指定したい場合があります。

body#layout #Pagelist2 .widget-wrap1 .widget-wrap1 .widget-content

またはそれを単純化する

#Pagelist2 .widget-content
于 2013-10-08T12:32:37.997 に答える