自适应与响应式

自适应:需要开发多套界面,通过检测视口分辨率,请求服务器,返回不同的页面

           1. 可表现为

          非同一终端通过服务器端处理,当你PC端访问移动端网站(在移动端网站做navigator浏览器对象处理)时,会返回PC端相应页面;
          移动端访问PC端页面(在PC端网站做navigator浏览器对象处理)时,会自动返回移动端相应页面
          其实访问的是两个域名(也就是两个网站,当然也就是两套CSS);

          同一终端,展现样式一样,无变化;如PC端打开 m.taobao.com ,F12,无论手机模式下,
           还是非手机模式下展现给用户的样式都是一样的。

          2.优点:兼容性更大,代码更高效。

          3.缺点:当需求改变时,可能要改动多套代码。 


响应式:一个页面一套CSS(处理了多种分辨率下的不同情况),根据不同的屏幕分辨率,加载不同分辨率下的的CSS,针对不同客户端在客户端做代码处理,来展现不同的布局和内容,如 商汤科技等https://www.sensetime.com/

            1.表现为:

            无论是PC端还是移动端访问的都是一个页面,只是展现了不同的页面样式;

            2.优点:面对不同分辨率设备灵活性强;

            3.缺点:  适用于简单的门户型网站。兼容的各种设备的工作量大,效率低;代码累赘,会出现隐藏元素,加载时间长。折中的设计解决方案。

           无论PC端还是移动端访问的都是一个域名(一个网站)

          

猜你喜欢

转载自blog.csdn.net/weixin_42315964/article/details/83586656