@程序员，一文掌握 Web 应用中的图片优化技巧！(13)
这是因为，在同样尺寸的屏幕上，高清屏可以展示的物理像素点比普通屏多，比如Retina屏，同样的屏幕尺寸下，它的物理像素点的个数是普通屏的4倍(2 * 2)，所以普通屏上显示清晰的图片，在高清屏上就像是被放大了，自然就变得模糊了，要从图片资源上解决这个问题，就需要在设备像素密度为2的高清屏中，对应地展示一张两倍大小的图。
而通常来讲，对于背景图片，我们可以使用CSS的@media进行媒体查询，以决定不同像素密度下该用哪张倍图，例如：
.bg{
background-image: url( "bg.png");
width: 100px;
height: 100px;
background-size: 100%100%;
}
@ media(-webkit-min-device-pixel-ratio: 2),(min-device-pixel-ratio: 2)
推荐阅读
- 电子竞技|和平精英：掌握这些技巧，分分钟成车神
- edg战队|王者荣耀：一招鲜吃遍天？1个英雄想打5个位置？掌握这几个完全可以
- 网游|颠覆你认知的网游土豪，程序员加班为他改游戏，还送专属服务器
- 网易|永劫无间诡异宕机事件：网易机房过热，程序员竟然祭出了干冰？
- 法术|双城之战：羁绊、海克斯强化、装备一文看懂
- 甄姬|甄姬三技能的稳定性加强，掌握5个玩法技巧对上分有帮助
- 地下城与勇士|DNF：一次给3张传说卡片！讨伐战S级奖励技巧，掌握两个要领就行
- 热血传奇|热血传奇：提升幸运属性实在太难？只是你没掌握到方法
- 庄周|敌方边路选择庄周应该如何应对？选择这些对位英雄就能掌握先机！
- 手机游戏|LOL手游掌握了流量密码，社交玩法才是国内手游的主旋律？