選択スタイリングCSS3

Question

は、これは私のコードです：

<table width="562" cellspacing="0" cellpadding="0" border="0" align="center" class="genericClass"> 
    Some nested tags 
</table> 

、私のスタイルは、次のとおりです。

table.genericClass a { ... } 
table.genericClass p,li,div,td {} 

しかし、すべてdiv、pとリストされたすべてのタグがない上記のスタイルを取得しています期待される。私の構文は間違っていますか？

Answer 1

DOMからdiv,li、tdのすべてを選択しました。あなたが唯一のクラスとテーブル内の要素にスタイルを追加したい場合はgenericClassあなたのコードは次のようになります。

table.genericClass p{ 
    /**your properties and values here**/ 
} 
table.genericClass li{ 
    /**your properties and values here**/ 
} 
table.genericClass div{ 
    /**your properties and values here**/ 
} 
table.genericClass td { 
    /**your properties and values here**/ 
} 

Answer 2

はにクラスを与えてみてください。

table.genericClass a { 
    /**your properties and values here**/ 
} 
table.genericClass p, 
table.genericClass li, 
table.genericClass div, 
table.genericClass td { 
    /**your properties and values here**/ 
} 

それとも、それらを個別にスタイルにしたい場合タグを使用してスタイルを設定します。私は以下の例を作成しました：

<div class = "div-Class"></div> 
<ul> 
    <li class = "li-Class">Lorem lipsum dolor sit amet.</li> 
<ul> 
<p class = "para-Class">Lorem lipsum dolor sit amet.</p> 
<table> 
    <tr> 
     <td class = "table-data">Lorem lipsum dolor sit amet</td> 
    </tr> 
</table> 

次に、必要に応じてCSSスタイルシートで使用します。 1つのクラスをdivに与えてスタイルシートのスペルを間違えた場合は、そのクラスをコピーしてスタイルシートに貼り付けます。例は次のとおりです。

.div-Class { 
    /* Some Styles */ 
} 

.li-Class { 
    /* Some more Styles */ 
} 

para-Class { 
    /* Even more Styles */ 
} 

table-data { 
    /* Some Table Styles */ 

希望します。