html - 选择性样式 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 a {
  /**your properties and values here**/
} 
table.genericClass p,
table.genericClass li,
table.genericClass div,
table.genericClass td {
  /**your properties and values here**/
}

或者如果你想单独设置它们的样式:

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**/
}