Question

例如，我有：

＆＃13;

table {
  border: 1px solid #ddd;
  width: 100%;
}

td {
  text-align: right;
}

.special {
  font-size: 24px;
}

＆＃13;

<table><tr><td>1</td></tr></table>
<table><tr><td>2</td></tr></table>
<table><tr><td>3</td></tr></table>
<table><tr><td>4</td></tr></table>
<table><tr><td class="special">5</td></tr></table>

＆＃13;

但是对于第5个表格，我不希望<td>右对齐，我希望它返回默认的<td>值。

如果你想知道为什么会这样，因为我组合了一张使用表格的信笺（由于我赢得了原因而无法使用div＆＃39;现在进入），因此如果其他部分包括表的css样式（这样你就不必定义每个表等），那么信头值将接管样式。 我知道我可以手动覆盖每一个，但我不知道哪些样式会事先应用。

再次肯定我知道可以用div标签完成，但忽略了我怎么能说不要将任何样式应用到第5个表中的td标签？或者有没有办法重置特殊定义中的所有默认值？

*更新：请记住我要合并文件，以便信头应该是完全独立的。 td:not不起作用的原因是因为我需要在所有使用信头的文件中指定它，这意味着每个文件都需要知道信头的属性。

Answer 1

使用:not()

td:not(.special)
{
    text-align: right;
}

Answer 2

这里最简单的选择是使用:not selector：

td:not(.special)
{
  text-align: right;
}

工作示例：https://jsfiddle.net/wuy6yp59/4/

另一个选项是使用unset覆盖所有属性。这假设你知道属性，但不知道默认值：

.special
{
  font-size: 24px;
  text-align: unset;
}

但实际上，最简单的方法通常是为所有非特殊td添加一个类。

Answer 3

试试这个 -

td:not(.special) {
    text-align: right
}

Answer 4

使用not selector，我们可以将样式应用于除一个

之外的所有表

<mat-autocomplete>

Answer 5

有两种解决方案。

第一个是使用:not ();，这是我的建议。

第二个是你提到表的类并使用它：.firstclass, . secondclass。

由于您希望对多个页面使用相同的样式，请使用：<link related="stylesheet" href="pagename">。这是添加css的外部方式。

Answer 6

大多数浏览器会显示具有以下默认值的元素：

td {
    display: table-cell;
    vertical-align: inherit;
}

＆＃13;

table {
  border: 1px solid #ddd;
  width: 100%;
}
td {
  text-align: right;
}
td.special {
  font-size: 24px;
  text-align: left;
  display: table-cell;
  vertical-align: inherit;
}

＆＃13;

<table><tr><td>1</td></tr></table>
<table><tr><td>2</td></tr></table>
<table><tr><td>3</td></tr></table>
<table><tr><td>4</td></tr></table>
<table><tr><td class="special">5</td></tr></table>

＆＃13;

了解有关td代码的更多信息。

Answer 7

我认为'td.special'将采用父元素的对齐方式。所以通常最好将自己的'text-align'属性设置为你想要的值。说

.special { all: unset;}

如何将css样式应用于除一个表之外的所有表？

7 个答案: