Question

我在table中有一个div，ID为table1和div1。

我想为表格中的单元格设置CSS。

CSS块是什么样的？像这样？：

div1.table1{

}

Answer 1

#table1 td {...}

pound表示后面的内容是一个id，在你的case table1中。后面的td表示“任何td是＃table1的后代”。 Here is a pretty good tutorial

编辑：对于效率最高的选择器，使用#table1 > tr > td {...}

Answer 2

如果你想尽可能具体：

#div1 #table1 tr td {

}

如果没有，你可以逃脱

#table1 tr td {

}

甚至

#table1 td {

}

后两个将为任何id为'table1'的元素设置样式（不仅仅是一个id为'table1'的元素，其元素的id为'div1'

Answer 3

假设html：

<div id="div1">
  <table id="table1">
    ...
  </table>
</div>

使用CSS：

#div1 #table1 td {
  ...
}

这样可以让您设置单元格样式。

Answer 4

#div1 #table1 td{ }

，因为

# = ID

. = class

nothing = tag

在我看来，更好的方法是......

#div1 table td{ }
<div id="div1"><table></table></div>

您实际上不需要为表创建新ID。这取决于你的div中是否有多个表格以及表格是否会有所不同，但是根据你的问题，我会说这会更好。

Answer 5

如果ID是table1和div1，则使用＃符号表示正在使用“元素”（＃div1，＃table1）。如果您将它们标记为类，则使用句点（.div1，.table1）。每页应使用一次ID，可以反复重复使用类。在这种情况下，您可能需要的只是#table1 td { }

Answer 6

其中任何一个都可行：

#table1 tr td{

}
#div1 #table1 tr td{

}
#table1 td{

}
#div1 tr td{

}
#div1 table td{

}

您可以使用空格来分隔标记。

Answer 7

或者，如果您的表是由某些服务器端脚本生成的，您还可以将CSS类显式添加到表行中，如

<table...>
  <tbody>
     <tr class="odd">
        <td>..</td>
        <td>..</td>
     </tr>
     <tr class="even">
        <td>..</td>
        <td>..</td>
     </tr>
  </tbody>
</table>

Answer 8

这取决于你想要的精确程度。 CSS代表层叠样式表，因此以下规则将从顶部到边界级联到最具体的规则：

/*  all td in the page */
td { color: '#aaaaaa' }

/*  all td in table with id table1 */
#table1 td { color: '#bbbbbb' }

/*  all td in a div that contains this table with this id */
div #table1 td { color: '#cccccc' }

/* all td in this specific div that contains this specific table */
#div1 #table1 td { color: '#dddddd' }

Answer 9

#div1 #table1 td  
{  
    ...  
}

编辑：已更正 - 我读得太快 - 我通常使用类而不是ID，因此我使用了。出于习惯。

为表中的单元格设置CSS

9 个答案: