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로 질문해오는 지인들 덕분에 공부마니하게 됨..^^*
'웹표준' 카테고리의 다른 글
[사내교육] 05강_이미지대체텍스트,폼,CSS클래스통합 (0) | 2011.12.15 |
---|---|
[사내교육] 04강_네비게이션,버튼스타일,박스모델링,포지셔닝,플로팅 (0) | 2011.12.15 |
[사내교육] 03강_CSS소개 (0) | 2011.12.15 |
[사내교육] 02강_HTML소개 및 마크업 (0) | 2011.12.15 |
[사내교육] 01강_웹표준이란? (0) | 2011.12.15 |