How to test a webpage meant for Retina display?

前端 未结 6 432
南笙
南笙 2020-12-12 10:17

I have coded a webpage meant for retina display. I currently do not have a retina display monitor.

Is there any simulator application or tool to test web pages for

6条回答
  •  执笔经年
    2020-12-12 11:11

    about:config hack on Firefox

    You actually can using Firefox:

    1. Go to about:config
    2. Find layout.css.devPixelsPerPx
    3. Change it to your desired ratio (1 for normal, 2 for retina, etc.)

    Screenshot:

    Refresh your page - boom, your media query has now kicked in! Hats off to Firefox for being awesome for web developing!

    This was done on Windows 7 with Firefox 21.0.

    The advantage of this solution is that it will trigger media queries and other advanced logic. If you're not doing that, and you're just feeding everyone the HiDPI images, you can just zoom in with Chrome etc (or write CSS to zoom for you, if that floats your boat).

    Zooming on Firefox & Edge

    Currently on Firefox and Edge, if you zoom it triggers dppx-based media queries. So this easier approach may be sufficient, but be aware that the functionality is reported as a "won't fix" bug for Firefox, so this could change.

提交回复
热议问题