1.1.1 所有盒子以边框开始计算
/*设置宽度以边框开始计算*/
-webkit-box-sizing: border-box;
box-sizing: border-box;
在移动端通常使用的是百分比布局，那么这样的布局如果使用border或者padding或使容器的宽度超出屏幕的宽度产生滚动条。那么我们的解决方案是什么试用css3属性 box-sizing设置所有的盒子重边框开始计算宽度。
1.1.2 Input清除默认的样式
/*在移动端怎么清除默认的样式*/
/*在移动端清除浏览器默认样式*/
-webkit-appearance: none;
在移动设备的浏览器当中表单一般会有默认的属性 通过border：none
outline：none是无法完全清楚的，还是会有一些浏览器默认的属性，比如：
内阴影，立体感、、、向这些浏览器默认加上的样式我们怎么去除呢？
我们有一个属性 -webkit-appearance 这个属性指的是设置成 none
1.1.3 最小宽度和最大宽度的限制
max-width: 640px; /*在行业当中的移动端的设计图一般使用的是640px*/
如果设计稿是750px
min-width: 300px; /*在移动设备当中现在最小的尺寸320px*/
适用：图片比较多的首页，门户，电商 等。
作用 保证页面在尺寸比较大的设备当中保证页面的效果也就是清新度
保证页面在小尺寸的设备当中有较好的布局效果。
1.1.4 Img的下间隙问题
<div>
abcdefghijklmnopqrstuvwxyz
<img src="../images/nv-fy.jpg" alt=""/>
</div>
文字基线默认的 baseline 是以X的下边开始的
Img是行内块级元素 它也会有默认的基线对齐。那么和文字一样也会距离底部有一定的间隙。Font-size 0 对齐的方式
1.1.5 搜索按钮调用
<!--在移动端点击弹出输入法 enter键会显示搜索-->
<form action="#">
<input type="search" placeholder="提示"/>
</form>
在移动端调用输入法的时候会弹出小键盘，键盘一般是enter键，那么在搜索框当中我们要求调用是搜索按钮，那么这样的结构才能调用出来。
1.1 知识内容
1.1.1 Touch事件
touchstart：当手指触碰屏幕时候触发。
绑定事件的方法：
dom.addEventListener(‘touchstart‘,function(e){});
事件返回的e对象包含那些移动端特有的属性：
targetTouches 目标元素的所有当前触摸
changedTouches 页面上最新更改的所有触摸
touches 页面上的所有触摸
touchmove：当手指在屏幕上滑动时连续触发。
绑定事件的方法：
dom.addEventListener(‘touchmove‘,function(e){});
事件返回的e对象包含那些移动端特有的属性：
targetTouches 目标元素的所有当前触摸
changedTouches 页面上最新更改的所有触摸
touches 页面上的所有触摸
touchend：当手指离开屏幕时触发。
绑定事件的方法：
dom.addEventListener(‘touchend‘,function(e){});
事件返回的e对象包含那些移动端特有的属性：
changedTouches 页面上最新更改的所有触摸
touchcancel：系统停止跟踪触摸时候会触发。
这个事件不会经常使用，了解即可。
注意：在touchend事件的时候event只会记录changedtouches
clientX:触摸目标在视口中的X坐标。
clientY:触摸目标在视口中的Y坐标。
pageX：触摸目标在页面中的x坐标。
pageY：触摸目标在页面中的y坐标。
screenX:触摸目标在屏幕中的x坐标。
screenY:触摸目标在屏幕中的y坐标。
1.1.2 过渡和动画结束事件
transitionEnd 过渡结束后触发。
绑定事件的方法：
dom.addEventListener(‘webkitTransitionEnd‘,function(e){ });
dom.addEventListener(‘transitionEnd‘,function(e){ });
animationEnd 动画结束后触发。
绑定事件的方法：
dom.addEventListener(‘webkitAnimationEnd‘,function(e){ });
dom.addEventListener(‘animationEnd‘,function(e){ });
1.1.3 Gesture 事件（不常用）
gesturestart
当一个手指触摸屏幕之后，第二个手指再触摸屏幕时触发。
gesturechange
当上面的事件触发后立即触发。
gestureend
第二根手指离开屏幕时触发，之后将不会再次触发gesturechange。
在event当中会返回另外两个参数
scale 根据两个手指的滑动距离计算的缩放比例 初始1
rotation根据两个手指的滑动距离计算的旋转角度 初始 0
1.1.4 全屏单页面布局
试用百分比的方式：
/*满屏*/
html,body{
height: 100%;
}