是否可以 select 基于当前页面的元素仅使用 CSS？

Question

考虑到我的整个网站只有一个 css 文件（这样做是一种常用技术），我想知道是否有办法 select 网站范围的属性，例如body （或实际上任何其他属性）根据当前页面仅使用 css.

类似

body:in('index.html') {
    some properties;
}

body:in('contact.html') {
    other properties;
}

同样，仅 css。我知道使用 php、js、jquery...

之类的简单解决方案

Answer 1

您可以添加 id 对 body 标签的致敬，并使用以下方式在其中设置样式：

body#contact div{
background:#376;
color:#857;
/*etc*/
}

有关 http://www.w3.org/TR/css3-selectors/

中选择器的更多信息

Answer 2

除了 DOM 树中显示的内容之外，选择器没有关于文档的信息，并且 DOM 不会根据其文件名公开有关页面的信息，URL ，或任何其他此类属性。

历史上有一个 @document at 规则用于查询当前 URL，但它已从 Conditional Rules Level 3 module. The most likely reason for this is the lack of cross-vendor implementations, as the only known implementation exists in Gecko, as @-moz-document 中删除。太糟糕了，您在野外发现的唯一用途是 而不是 以根据特定页面应用 CSS，但仅作为 CSS 破解 Firefox。

如您所述，最简单的解决方法是让每个页面将唯一的 class 应用于 html 或 body 元素，并根据 select class，无论是通过硬编码还是动态。

是否可以 select 基于当前页面的元素仅使用 CSS？

Is it possible to select an element based on the current page using only CSS?

html

css

css-selectors