css - 反转页面上的所有内容，除了::选择

Question

我想反转页面，但我也希望文本选择保持原样。我尝试使用 ::selection 来排除它，但没有成功。

这是我用于反转的 css 代码:

html {
 background-color: #131313 !important;
 filter: contrast(85%) brightness(100%) invert(100%);
 -webkit-filter: contrast(85%) brightness(100%) invert(100%);
}

这是我要排除的标签的代码:

em, img, svg, image, video, audio, embed, iframe, object, button, canvas, .sidebar-description
{
  filter: invert(100%) !important;
  -webkit-filter: invert(100%) !important;
}

Answer 1

我相信您正在寻找的是链式 :not 选择器调用。这是一个简单的示例，它将页面上的所有字体颜色变为红色，链接和按钮除外。

*:not(a):not(button) {
    color: red;
}

这是您的用例:

*:not(em):not(img):not(svg):not(image):not(video):not(audio):not(embed):not(iframe):not(object):not(button):not(canvas):not(.sidebar-description)
{
    filter: invert(100%) !important;
    -webkit-filter: invert(100%) !important;
}

这可能需要根据您所处的特定设置进行调整，但这看起来像您需要使用的。