我正在尝试选择除我当前单击的内容以外的所有内容。
基本上，我有一堆 .node-teaser 元素，它们都采用相同的样式并具有相同的类，只是它们在 :active 上变得更大。
当我点击一个时，我想“重置”所有其他动画/过渡，以便只有当前的动画/过渡变大。所以，基本上，我想:
.node-teaser:not(.node-teaser:active) {
max-height: 50px;
.....
}
但是，我不能使用伪类作为 :not() 的参数。我该如何以不同的方式解决问题，或者我是否遗漏了什么？
我坚持使用我拥有的类，因为它们是由 Drupal 生成的，我真的不想为主题更改我的 PHP 模板。而且，我想向自己证明这适用于纯 CSS，但我被卡住了。
有这个~选择器。如果有东西可以选择当前元素之前的每个元素(与选择元素之后的所有内容的波浪号选择器相反)，我基本上可以将这两个相加，并且我将拥有之前的所有内容和之后的所有内容=除当前元素之外的所有内容。不过，我不认为有一个选择器与 ~ 相反。如果我错了，请纠正我!
编辑: 因为我似乎很困惑 ^.^(抱歉):关于 adornis.de我一次只想展开一个元素，当您单击第二个元素时，其余元素应该关闭。通常 :active 无论如何都会立即关闭，但我正在延迟转换。
最佳答案
解决方案是:您可以使用伪类，只是不能将它们与真实类组合。
所以
.foo:not(.foo:active) {}
没用，但是
.foo:not(:active) {}
工作得很好:)
这并没有解决我的问题，但我想理解这一点很重要。我仍然必须混合使用类和伪类来实现我的目标。
结论:如果没有 javaScript(目前)你不能这样做
感谢 BoltClock 在对原始帖子的评论中回答了这个问题 :)
You've run into the exact same issue that somebody else did the other day: you can use pseudo-classes in :not(), but in this case you're combining both a class and a pseudo-class, which is not OK
关于css - :not pseudo class selector - css issue 伪类的功能，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12984081/