Сабж под катом
.grayscale { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: url(grayscale.svg#greyscale); /* Firefox 4+ */ filter: gray; /* IE 6-9 */ }
Вот только две проблемы:
- с svg сильно не напрыгаешься;
- подогнать разные картинки в один оттенок серого довольно сложно.
Например:
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Объясню для тех кто не понял: не для кого не секрет, что css и html это не фотошоп, и изменить серость, желтого и красного и уж тем более черного, особого метода нету (ну кто-то пытался это сделать через opacity но результат был не особо успешным). В результате добрый дизайнер мог это все подвинуть в оттенках серого и уж тогда этот css вам ни как не поможет. И как не старайся потом решение чаще всего только одно — спрайт.