更新时间：2024-07-18 23:56:47
网站建设
262目前的响应式设计一般考虑四种尺寸（宽高一般是按照9:16的比例计算，然后减去浏览器顶部和底部导航栏的高度）：
手机：360px（5寸左右的手机，一般最低都兼容320px，下面的手机基本都淘汰了，不用担心）
Tablet: 361 - 1024 px（现在连11寸的笔记本都不用1024分辨率了，直接赋值给平板）
主流PC显示器：1025 - 1920 px（1080P是目前桌面显示器的主流）
超清PC显示器：1921 - 5120 px（主要考虑2K、4K、5K等超高分辨率，以后考虑）
1. 手机
响应式设计的正确流程应该是先移动端，然后逐渐放大到更大的尺寸，所以应该优先设计手机端的样式，而不是设计传统的桌面网站，然后试图压缩到移动端电话。至于如何设计手机Web界面，这里就不赘述了。相信各位设计师朋友们都有自己的想法。
2. 平板
平板端基本上就是移动端的放大版，直接复制可以完成75%的工作，但是直接复制单个元素会显得太大，毕竟页面分辨率几乎是3倍上一个。因此，平板终端的布局可以比移动终端多分几列。比如直接在移动端设计一个ListView，在平板端可以分成2~3列。移动端全屏宽度的按钮在平板端会显得过长。可以考虑适当缩短，留出足够的高度供手指敲击。移动端必须隐藏的导航、菜单等可以考虑直接显示，填补多余的空间。
3. 主流PC显示器
这个没什么好说的，传统的网页设计想必大家都很熟悉了。这里唯一要注意的是保持布局的连贯性。响应式设计的PC端由平板端放大适配。它可以显示更多内容，但与平板端应该不会有太大区别。确保用户能够识别出这两个是同一个网站。
4. 超清PC显示器
过去没有考虑到这一点。那时候1080P还是一个很流行的概念，1024px还是笔记本的分辨率。但现在随着2K/4K屏幕的逐渐普及，这部分用户的占比开始一点点增加，问题逐渐凸显，不容忽视。没有特殊适配方案的网页在这些环境下会出现两种情况：原本适配全屏的页面会被拉得太宽，原本定宽页面的两边会留下一大片空白.面对这一事实，设计师在设计适配方案时需要考虑页面在这些设备上的外观。
我们专注高端建站，小程序开发、软件系统定制开发、BUG修复、物联网开发、各类API接口对接开发等。十余年开发经验，每一个项目承诺做到满意为止，多一次对比，一定让您多一份收获！
