, 可以达到更高的分辨率 , 画面显示效果更好 ;
下图中都是 2x2 像素的 CSS 大小 , 但是在普通屏幕中是 4 个像素点 , 在视网膜屏幕中是 16 个像素点 ;
在普通屏幕中 , 填充...4x4 像素 大小的区域 中 , 如果 强行为其设置 2x2 的图像 , 将其拉伸 , 就会导致图片模糊 , 无法发挥视网膜屏技术的最佳显示效果 ;
基于上述问题 , 提出了 倍图 概念 , 在标准的视口设置中..., 使用倍图提高图片质量 , 解决在高清设备中使用低分辨率图片导致的显示模糊问题 ;
如果要 为 100x100 像素的盒子模型设置图片 , 可以 准备一张 200x200 的图片 , 然后 手动将图片缩小为...二倍图概念
----
二倍图(@2x)是指在 设计时按照原尺寸大小的 2 倍来创建图像,以便在 高分辨率设备上展示更清晰的图像。...三、代码示例
----
使用 一倍图 和 二倍图 显示在相同大小盒子中 , 在 PC 端显示效果基本一致 , 但是如果在 视网膜屏中 , 二倍图 更清晰 ;
代码示例 :
<!