0

我有一个描述表格的 CSS 元素，它包含以下行：

.pricing tr td:last-child { text-align: right; }

这使得最后一列中的文本向右对齐。定价类是我要编辑的表的类。我真的无法弄清楚或在任何地方找到在 CSS 中列出表格标签的规则。如果我放：

table .pricing tr td:last-child { text-align: right; }

或者

.pricing table tr td:last-child { text-align: right; }

然后这条线不起作用。但是，如果我输入：

table.pricing tr td:last-child { text-align: right; }

然后它确实有效。

更令人困惑的是，我正在编辑一个主题的 CSS，它有以下几行：

table caption { font-weight: bold; text-align: left; padding: 4px 6px; border: 1px solid #ddd; border-bottom: 0; background: #ffd53c url(img/pattern.png); }

table th, table td { padding-left: 6px; padding-right: 6px; line-height: 21px; border: 1px solid #ddd; background-color: #fff; text-align: left; vertical-align: middle; }

table th, table tfoot td { font-weight: bold; background: #eee url(img/pattern.png); }

table tfoot a { text-decoration: none; }

table .alternate td { background-color: #fafafa; }

table.large th,table.large td { padding: 12px 8px; }

我只是想弄清楚一个规则，什么时候放table，什么时候不放table，是一定要写tr td还是只写td，类选择器放在哪里（在一切之前，在中间，有或没有table ， ETC）。

我的 HTML 很简单，就是这样：

<table class="pricing">
  <tr> <th>Codes </th> </tr>
  <tr> <td>The Constitution of the Russian Federation (adopted at National Voting on December 12, 1993)</td> <td>£34.00</td> </tr>
4

2 回答 2

0

如果此选择器有效

table.pricing tr td:last-child

这意味着你的桌子有一个pricing班级，所以很明显

table .pricing tr td:last-child

不能工作（因为你正在寻找table和tr（例如tbody/thead/tfoot）与类pricing和这条规则之间的孩子

.pricing table tr td:last-child

查找包含在具有parent类的元素中的表。这绝对是三个不同的规则

是否需要在选择器中指定元素/类取决于您的规则必须有多具体，如果您必须覆盖先前的规则。作为一个经验法则，我建议您开始定义更简单（更短）的规则并增加它们的特异性，直到不应用样式。

于 2013-09-23T11:25:58.770 回答
0 
table .pricing

表示选择器适用于任何表中具有 .pricing 类的元素。

table.pricing (no space)

指示所选元素是具有 .pricing 类的表。

于 2013-09-23T11:27:41.520 回答