Question

我们的生产环境使用的是与多个css类不兼容的适应技术。这意味着在设置HTML样式时很容易忘记和使用两个类，并且一旦生成它就会中断。

我想使用CSS作为一种方式来突出显示某人忘记并意外地将两个类应用于元素。

这样的事情是我的意图，虽然当然这是无效的。它应该突出显示应用了两个类的任何元素：

.*.* { /* not valid (I wish) */
  outline:2px dotted red;
  }

据我所知，如果我知道这些课程就行了，问题是我想要标记任何两个类：

.classA.classB { /* not good enough */
  outline:2px dotted red;
  }

我知道我可以用JS和书签来做到这一点，也许这是唯一的解决方案。如果只有CSS可以更好，因为它会自动标记所有开发人员和QA的东西。

Answer 1

我刚刚找到了一个可以接受的答案：

[class*=" "] {
  outline:2px dotted red;
  }

这会突出显示class属性中包含空格的任何内容。它会产生一些误报，因为有时类属性中的空格会因为清晰的服务器端代码而合法地发生，但我更喜欢误报的误报。

有更好的想法吗？

Answer 2

要删除大多数误报（例如，空格填充的属性值），您可以使用此选择器：

[class*=" "]:not([class^=" "]):not([class$=" "]) {
    outline: 2px dotted red;
}

这仍然没有过滤掉Phrogz在你自己的答案中指出的class="foo foo"等值中的重复类，但它总比没有好，而且我觉得这样做要少得多可能比具有空格填充的类属性发生。

Answer 3

单独使用CSS是不可能的。

而且，如果我这样说，你的生产环境很愚蠢。没有多个类的CSS就像一个标签云，每个项目只允许一个标签。它打败了一些目的。修复您的生产环境，不要以这种方式滥用CSS，而不是限制您的作者正确地，语义地描述内容。