レスポンシブでコーディングをしています。
img {width:100%;}としているのですが、Macので見るとぼやけていない画像も、Windowsではぼやけて見えてしまいます。
画像は、表示するサイズの2倍サイズで作っているのですが、Windowsではぼやけてしまいます。
ただ、表示するサイズと同じサイズで画像を作ると、Windowsでは綺麗に見えるようになり、Macではぼやけてしまいます。
良い解決方法知っている方いれば、ご教示ください。お願いします。
ブラウザは?
回答ありがとうございます。ブラウザはどちらもChromeを使っています。
Firefoxで見ても同じ症状ですね。。。
img {width:100%;height:auto;}を書いても変わりないですか?
ありがとうございます!
>Windowsでは綺麗に見えるようになり、Macではぼやけてしまいます。retinaディスプレイのこと言ってるのかな。高解像度のものを縮小した時に表示が汚いのは、ブラウザのレンダリング性能任せだからどうしようもないよ。fontにしてもそうだけど、基本的にwindowsに綺麗さを求めてはいけない。「表示されればおk」それが古から伝わるwindows(ノンデザイナーズ集団)の思想。
ブラウザの話だからWindows関係ないけどね。大嫌いだからいろいろ書いちゃったよ。
macがretinaなのですね。
srcset入れて振り分けて解決。www.marguerite.jp/Nihongo/WWW/RefHTML5/Attrs/srcset.html
>windowsに綺麗さを求めてはいけない。「表示されればおk」それが古から伝わるwindows(ノンデザイナーズ集団)の思想。
個人的にはこの部分には同意しかねるな。
> 同意しかねるいろいろ意見があってよいと思います。たとえば、windowsのアラートウィンドウの「OK」ボタンはキャンセルの左側に配置されてますが、なぜ左側に配置されているか理解できますか?私が言うところのノーデザインとはそういうことを指していますよ。だっておそらくそこには大した意図が用意されていないくて、その負の財産を2015年にもなって引きづってるわけですから。
縮小前と縮小後のサイズ比がぴったり整数倍じゃないと、ブラウザによってはボケるよ。
これな
参考になった
みんなの回答 3 件
ブラウザは?
>Windowsでは綺麗に見えるようになり、Macではぼやけてしまいます。
retinaディスプレイのこと言ってるのかな。
高解像度のものを縮小した時に表示が汚いのは、ブラウザのレンダリング性能任せだからどうしようもないよ。fontにしてもそうだけど、基本的にwindowsに綺麗さを求めてはいけない。「表示されればおk」それが古から伝わるwindows(ノンデザイナーズ集団)の思想。
縮小前と縮小後のサイズ比がぴったり整数倍じゃないと、ブラウザによってはボケるよ。
関連するトピックス