css - 将 CSS 规则标记为不那么重要？

Question

有没有办法将 CSS 规则标记为不太重要，这样它就不会覆盖后续规则，即使第一条规则的重要性更高？例如，假设我的 CSS 文件中有以下内容:

#inputDiv input[type="text"]{
    width:125px;
}

#differentInput1{
    width:25px;
}

#differentInput2{
    width:500px;
}

我的想法是，所有作为 div“inputDiv”子项的文本输入字段的宽度都为 125px，除了某些特定的输入具有其他宽度。问题是第一个声明覆盖了特定的元素声明。

我试过以下方法:

1. 将 !important 附加到每个特定宽度。可行，但许多人声称(我认为这是正确的)应该避免使用 !important，而且它相当麻烦，因为它必须添加到具有特定宽度的每个元素。
2. 将 #inputDiv 添加到每个特定的选择器之前，即 #inputDiv #differentInput1 同样有效，并且避免了使用 !important 时出现的问题，但仍然很麻烦，因为必须对每个元素都这样做。

有没有什么办法可以简单地说第一个声明中的元素不那么重要，不应该覆盖任何东西？

Answer 1

没有办法做到这一点，因为它与 CSS 对立，就像 !important 一样——反之亦然。您唯一的选择是依赖选择器的特异性。例如，您可以使用 inputDiv 的类而不是 ID，以一种不那么麻烦的方式编写它。