Czy można przewinąć całą stronę do skali szarości za pomocą CSS?

Question

Chciałbym zmienić całą witrynę w skalę szarości. Oczywiście, mogę ręcznie edytować CSS i dostosować każdą pojedynczą kompilację color, background-color &. własność i mogę dostosować każdy obraz w Photoshopie.

Ale czy istnieje łatwiejszy sposób, np. używając czystego CSS?

Np. Coś takiego jak umieszczenie nakładki 100% x 100% div na górze strony, która zamienia każdy kolor na skalę szarości?

Jakieś wskazówki?

Answer 1

Tak nie jest, wystarczy użyć filtra w skali szarości

CSS

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

Uwaga: Można zastosować to w każdym elemencie (html, ciało, nagłówka, etc ...)

DEMO HERE

Answer 2

Nie trzeba ustawiać filtra przy każdym śpiewie le element, Możesz zastosować filtr w HTML.

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

lub body, jeśli chcesz zachować kolorowe tło na html.

http://codepen.io/anon/pen/VLawaK