我需要一个 css3 选择器,当 :target 等于元素的 id(简单)或当 :target
为空时(不可能?) .这很难解释,所以让我给你一个简单的例子。
div {
background: blue;
}
div:target, div:no-target {
background: red;
}
当然 :no-target
伪类不存在 ;)。有没有不使用 Javascript 的解决方法?提前致谢!
最佳答案
叹息。我觉得我正在复活一个死话题,但它需要一个真正的答案。
可以单独使用 CSS 来完成此操作,只需使用 :last-child
和 general sibling combinator , 形式为 :target ~ :last-child
:
.pages > .page:target ~ .page:last-child,
.pages > .page {
display: none;
}
/* :last-child works, but .page:last-child will not */
.pages > :last-child,
.pages > .page:target {
display: block;
}
规则适用于以下步骤:
- 隐藏所有页面
- 同时显示目标页面和最后一页
- 如果一个页面被定位,隐藏最后一页(
.page:target ~ .page:last-child
)
编辑: 显然这与 an older, previously mentioned, related post 中接受的答案非常相似.
关于:target empty 时的 CSS 选择器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6867095/