是否可以使用CSS将整个网页变为灰度？

Question

我想把整个网站变成灰度.当然,我可以手动编辑CSS并调整每一个color,background-color&co.属性,我可以在Photoshop中调整每个图像.

但有没有更简单的方法,例如使用纯CSS？

例如,div在您的网站顶部放置100%x 100%叠加层,将每种颜色变为灰度？

任何提示？

Answer 1

是的,只需使用滤镜灰度

CSS

*{
    -moz-filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    filter: gray; /* IE6-9 */
    filter: grayscale(100%);
}

注意:您可以在任何元素(html,正文,标题等)中应用它.

Answer 2

无需在每个元素上设置过滤器,您可以在HTML上应用过滤器.

html {
    -moz-filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    filter: gray; /* IE6-9 */
    filter: grayscale(100%);
}

或者如果你想在html上保留彩色背景的身体.