CSS3——meta视口标签

今天看了一点，关于移动端开发的知识，就是简单的了解了一点。

关于移动端的开发，我的理解就是手机客户端嘛，手机的话相对于PC端的话会比较简单一点，因为PC端需要兼容不同的浏览器，考虑的比较多一些，但是移动端的话相对简单点，不需要兼容五大浏览器。

移动端开发主要是处理webkit内核的

视口 

布局视口：就是在画页面时，设置的页面的宽度

                  页面在不同的移动设备中，布局视口是不变的，但是呈现效果是不好的。

视觉视口：就是浏览器网站的区域

                   打开一个网站时，所看到的网站的宽度就是视觉视口，会根据浏览器的放缩而变的。

理想视口：设备的宽度

                   meta标签：设备视口多宽，布局视口就有多宽

<meta  name="viewport" content="width=device-width,user-scalable=1,initial-scale=no,maximum-scale=1.0,minimum-scale=1.0">

  

name="viewport"   视口标签属性

width=device-width   视口宽度为设备宽度

user-scalable=no/0  不允许用户缩放页面

user-scalable=1  允许用户缩放页面

initial-scale=1.0  初始页面缩放倍数

maximum-scale=1.0  最大缩放倍数

minimum-scale=1.0  最小缩放倍数

 

一般写法

<meta  name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0">