ie8 에서 blur처럼 이미지 번짐 현상 해결 방안 (IE Bicubic fix)

ie8에서 이미지가 blur처럼 번지는 현상이 생길때, 처리하는 방법

(IE Bicubic fix)

사진에서와 같이 포토샵에서 텍스트이미지를 추가한 후에

ie8에서 이미지가 blur처럼 번져서 텍스트가 흐릿해지는 경우가 생긴다.

물론 이미지 전체적으로 번져진것인데 텍스트는 그 선명도가 확연히 나타나기 때문에 눈에 더 잘 띈다.

일반적으로는 css에 다음과 같이 추가를 해주면 된다.

<style>

img {-ms-interpolation-mode: nearest-neighbor;}

</style>

간혹 쇼핑몰과같은 오픈마켓이나 기타 업로드를 해야하는 포탈에서도  부모css의 영향을 받아서 이런현상이 나타나게 되는데 이럴때는 인라인으로 처리를 해주면 된다.

<img src=""  style="-ms-interpolation-mode: nearest-neighbor;">

Ie7에서는 다음과 같이 처리해주면 된다.

img { -ms-interpolation-mode: bicubic; }

이 문제를 해결하기위해 접근한 방법

컴퓨터(OS)의 문제인가를 확인 > 모니터의 문제인가를 확인 > 브라우저의 문제인가 확인 > 해당 사이트의 문제인가 확인

해답은 브라우저+사이트의 문제였음.

항상 최신의 좋은 브라우저를 사용한다는것은..어쩌면 문제를 인식하지 못할 수 도 있다는것을 알았음.

가끔 IE로 질문해오는 지인들 덕분에 공부마니하게 됨..^^*