Closed2
Google Chromeで発生する縮小表示した画像のにじみ（ぼんやり感）の解消
おとのGoogle Chromeのみ、縮小表示した画像のにじみ（ぼんやり）が発生する（2022年9月現在）
解消方法はbodyタグに以下のCSSプロパティを追加するだけ。
css
body {
image-rendering: -webkit-optimize-contrast;
}
ただし、上記のCSSを効かせた時にSafariのみ画像が少々荒れて表示されてしまうので、Chromeのみ上記のプロパティを効かせるように修正する。
@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
body {
image-rendering: -webkit-optimize-contrast;
}
}
本件、Chromeのアップデートで解消されたみたい。
上記CSSの指定は不要になりました✨
このスクラップは2023/01/08にクローズされました
ログインするとコメントできます