本站公告: 暂无公告....

响应式设计分辨率的规划

前端开发 兰亭楼 0评论 685浏览

响应式设计的基本原理就是根据不同终端的分辨率的宽度来呈现不同的样式,那么根据目前屏幕分辨率的现状应该如何进行 响应式设计分辨率的规划 呢?

1.移动设备

Iphone设备

iphone4/4S检测到的实际分辨率: 320*480

iphone5/5S检测到的实际分辨率: 320*568

安卓设备:

1280*720检测到的实际分辨率:360*640 四个像素点显示一个像素

1920*1080检测到的实际分辨率:360*640 九个像素显示一个像素

因此我们移动端可以这样规划:320适配iphone  360适配andorid.

平板设备:

平板设备大都按照实际分辨率来进行渲染,所以不需要额外的进行适配

2.桌面电脑设备

以下是CNZZ统计出来的国内桌面电脑的分辨率占用率百分比:

响应式设计分辨率的规划

根据上图我们可以得知 我们需要重点支持的分辨率有四个 1366*768、 1440*900、1024*768、1920、1080。

因此桌面端的规划我们可以这样  1024-1360为一个区间, 1366-1400为一个区间 ,1440-1680为一个区间 1680-1920为一个区间。

以上便是 响应式设计分辨率的规划 基本思路。

 




转载请注明: 兰亭楼 » 响应式设计分辨率的规划

发表我的评论 换个身份
取消评论

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址