728x90

최근 중국의 모든 웹사이트들은 모두 회색으로 되어 버렸다.

처음에는 나의 6개월밖에 되지 않은 m1 맥북 모니터가 맞탱이 간줄 알았지만 알고 보니 중국내의 높은 분이 돌아갔다고서 모든 웹페이지가 회색으로 처리 되었던것이다.

아마도 최근 몇년동안 있는 서거한 인물중에 가장 큰 인물이라 그런가 보다. 하지만 개발자인 나는 그것보다 어떻게 나라의 모든 포탈포함해서 모든 국내사이트들을 이렇게 빠짐없이 "빠른 시간에 바로 회색으로 처리 되었을까?" 하는 의문을 가지게 되었고 비교적 효과적으로 처리할수 있는 방법을 알아냈다.

방법1:

<style type="text/css">
html {
  filter:grayscale(100%);
  -webkit-filter:grayscale(100%);
  -moz-filter:grayscale(100%);
  -ms-filter:grayscale(100%);
  -o-filter:grayscale(100%);
 filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
  -webkit-filter:grayscale(1)
}
</style>

filter는 필터를 의미한다. filter:gray는 페이지에 그레이스케일 필터를 붙여서 html의 모든 내용이 흑백이 된다. 그러나 이 필터는 chrome과 safari 브라우저에는 먹히지 않기 때문에 아래에 -webkit-filter: grayscale(100%)이라는 문구가 있다. 이 형식은 webkit 커널을 사용하는 브라우저 전용으로 FILTER: gray;와 비슷하다.

 

방법2:

아래 코드는 css 의 제일 상단에 넣을가.

<style>
 html {
 filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
 -webkit-filter: grayscale(100%);}
</style>

혹시 표준 웹사트가 아니라서 css 코드가 안먹히는경우가 있다.

그려면 아래 처럼 입력해라. 아래 코드는 익숙하지?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

설마 요즘 플래시 쓰는 웹사이트도 있을까? 하는 마음에 아래코드도 미리 작성해놨다.

<param value="false" name="menu"/>
<param value="opaque" name="wmode"/>

 

마지막으로 아래코드를 최종 참고해서 작성해보면 될것 것다.

html{
    -webkit-filter:grayscale(100%);
    -moz-filter:grayscale(100%);
    -ms-filter:grayscale(100%);
    -o-filter:grayscale(100%);
    filter:grayscale(100%);
    filter:url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
    filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)
}

끝!

+ Recent posts