프로그래밍/HTML+CSS

css chrome from blurring small images

p-a-r-k 2017. 5. 24. 11:21
반응형

mobile chrome 에서썸네일 넓이가 110px 미만이면

흐릿하게 blur 처리가 되는데

또렷하게 보이도록 해당 기능 막는법

1
2
3
4
5
6
7
8
img {
    image-rendering: optimizeSpeed;             /*                     */
    image-rendering: -moz-crisp-edges;          /* Firefox             */
    image-rendering: -o-crisp-edges;            /* Opera               */
    image-rendering: -webkit-optimize-contrast; /* Chrome (and Safari) */
    image-rendering: optimize-contrast;         /* CSS3 Proposed       */
    -ms-interpolation-mode: nearest-neighbor;   /* IE8+                */
}


반응형

'프로그래밍 > HTML+CSS' 카테고리의 다른 글

css image-rendering 이미지 흐림/깨짐  (0) 2017.11.22
HTML5 미니게임 개발  (1) 2017.11.03
css3 transisiton 애니메이션 사용  (0) 2017.02.28
css img hover scale effect  (0) 2017.02.15
css3 button push effect  (0) 2016.12.13