html移动端处理

一、 当用户访问淘宝网站的时候，网站做了什么处理？

大网站：一般情况下，PC端的网页和移动端的网页是两套代码。

用户：www.taobao.com -> 淘宝的服务端（检测用户是PC端过来，还是移动端）
        -> PC端 -> https://www.taobao.com
        -> 移动端 -> 后端重定向  -> https://main.m.taobao.com/

PC:https://www.163.com/
移动：https://3g.163.com/touch/#/

那么有可能用一套代码：既可以针对PC端又可以适配移动端。
    答：可以做到。响应式布局方案。
        注：这种方案针对小网站，不适合做中大型网站。

二、 viewport视口

PC端就没有视口。viewport视口是移动端才有的概念。

两个视口：
    1. 可视视口：固定大小的，跟手机设备一样。在上面。
    2. 布局视口：可调节大小的，默认980，压缩到可视视口的大小，在下面。

三、如何让布局视口改成跟可视视口一样大？

调节布局视口 375 -> 375 , 414 -> 414

width : 414 可以给固定大小，99%网站不会这么设置，因为不好适配。
width : device-width 动态的 ，设备414 -> 414  设备375 -> 375
height : 不去设置。
initial-scale : 1.0
minimum-scale : 1.0
maximum-scale : 1.0
user-scalable : no 
建议viewport设置：<meta name="viewport" content="width=device-width, initial-scale=1.0 , user-scalable=no">