如何在Windows上测试Retina的网站，没有实际的Retina显示？ [英] How to test a website for Retina on Windows without an actual Retina display?
问题描述
有没有办法在Windows上模拟视网膜显示器来测试网站的HiDPI显示器如Retina？
Is there a way to simulate a Retina display on Windows to test a website for HiDPI displays such as Retina?
我在标准的241920x1080显示器上运行Windows昨晚，我在一个朋友的全新15Retina MacBook Pro上检查了我的网站，图形看起来都模糊（比一个普通的15英寸MacBook差得多），而字体是超清晰锐利，使标志出现甚至
I run Windows on a standard 24" 1920x1080 monitor. Last night I checked out my website on a friends brand new 15" Retina MacBook Pro and the graphics looked all blurry (far worse than on a regular 15 inch MacBook), while the font was super crisp and sharp, making the logo appear even worse because of the direct comparison.
我已按照本教程使我的网站Retina准备好了：
I have followed this tutorial to make my website Retina ready:
a href =http://line25.com/tutorials/how-to-create-retina-graphics-for-your-web-designs> http://line25.com/tutorials/how-to-create-retina -graphics-for-your-web-designs
http://line25.com/tutorials/how-to-create-retina-graphics-for-your-web-designs
我使用retina.js方法，因为我没有任何背景图片。
I used the retina.js approach since I don't have any background images.
有没有办法让我测试这是否真的有效？显然，我可以请我的朋友使用他的Retina笔记本，但这不是一个可行的工作流程为我。
Is there any way for me to test if this actually works? Obviously I could ask my friend to use his Retina Notebook but that is not a feasible workflow for me. I want to be able to at least roughly test websites for Retina compatibility it in my own environment.
推荐答案
about： config hack on Firefox
您实际上可以使用Firefox：
You actually can using Firefox:
- 转到about：config
- 查找layout.css.devPixelsPerPx
- 将其更改为所需的比例视网膜等-1似乎是默认。）
屏幕截图：
Screenshot:
刷新页面 - 热门，您的媒体查询现在已经开始！打开Firefox的网站开发的好东西，不仅将现在的网站提高到两倍的大小，Firefox UI也将翻倍，这种加倍或缩放是必要的，因为这是您可以在标准像素比例屏幕上检查所有像素的唯一方法。
Refresh your page - boom, your media query has now kicked in! Hats off to Firefox for being awesome for web developing! Heads up, not only will the website now be boosted to twice the size, the Firefox UI will also be doubled. This doubling or zooming is necessary, as that's the only way you'll be able to examine all the pixels on a standard pixel ratio screen.
在Windows 7上使用Firefox 21.0，在Mac OS上也可以正常工作X与Firefox 27.0.1。
This works fine on Windows 7 with Firefox 21.0, and also on Mac OS X with Firefox 27.0.1.
如果您不使用媒体查询和其他更高级的逻辑你喂大家HiDPI图像），你可以只是放大你的浏览器到200％。 Chrome模拟功能是一个非常实用的工具，它可以在媒体查询中执行，但因为它阻止缩放，因此无法检查图片质量。
If you're not using media queries and other more advanced logic (i.e. you're feeding everyone the HiDPI images), you can just zoom in with your browser to 200%. The Chrome emulation is a helpful tool as well as it kicks in media queries, but because it prevents zooming, you can't examine image quality.
缩放Firefox& Edge
目前在Firefox和Edge上，如果缩放它会触发基于dppx的媒体查询。因此，这种更简单的方法可能就足够了，但请注意，此功能被报告为无法修复错误，因此这可能会改变。
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.
这篇关于如何在Windows上测试Retina的网站，没有实际的Retina显示？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
