0
너비가 100px이고 높이가 100px 인 PNG 이미지가 있습니다.PNG의 강제 축소로 인해 흐림이 발생 함 (Chrome)
CSS : img { max-width: 70px }으로 크기를 조정합니다.
결과가 흐립니다.
무엇이 잘못 될 수 있습니까?
A
답변
1
아마 100px 사각형이 정확히 70px로 나눠지지 않기 때문에 이미지의 픽셀 크기를 조정하고 보간하여 브라우저가 이미지의 비트를 잘못 렌더링하고 있기 때문일 수 있습니다. max-width: 50px 또는 max-width: 75px에서 시도해 보시고 여전히 흐릿한 지 확인하십시오.
이미지 크기 조정은 2/4/8의 배수로 원하는 크기로 정확하게 나눌 수 있으면 훨씬 쉽습니다.
(당신이 HiDPI/망막 스크린에 없다고 가정하면, 전체 망막 이미지를 렌더링하기에 충분한 픽셀이 75px 사각형에 없기 때문입니다.)