CSS 이미지 축소시 화질 저하문제 해결방법

728x90
반응형

​img[src$=".gif"], img[src$=".png"] {
image-rendering: -moz-crisp-edges; /* Firefox */
image-rendering: -o-crisp-edges; /* Opera */
image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
image-rendering: crisp-edges;
-ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
}

img 태그의 크기를 원본보다 줄일 경우 화질저하 문제가 발생하는 경우가 있다.
그때는 위 코드와 같인 image-rendering 속성을 사용해 렌더링 방식을 변경해주면 해결된다.

728x90
반응형