移动端的东西

适配方法：

1.固定高度，宽度自适应。

2.固定宽度，viewport缩放。（需要根据屏幕宽度动态生成viewport）

3.用rem做宽度和高度。（也是根据屏幕动态生成）。这样可以让页面在不同的移动端

都呈现一样的效果。

 

 

 

如何实现响应式布局

一、@media媒体查询

<meta name=”viewport” content=”width=device-width.initial-scale=1.0”>

@media all and (min-width:640px) and (max-width:740px){}

<link type=text/css href>

总结:在实现媒体查询的布局中优势就是我们只需写好一个页面一个尺寸的样式以后 剩下的就是复制黏贴，

但可能要划分多个区间，区间越多改的越多

划分区间的时候我们一定要将区间划分的明细从上到下从小到大，区间一定是开区间

 

为什么会被用起来？

基于媒体查询实现一套页面，能够适配不同的终端

二、弹性盒子

三、百分比

使用百分比布局的方式就是参考设计图，对设计图规定的任何元素进行百分比换算

如果页面存在一些复杂计算会导致计算量巨大，并且全局计算单位不可控

 

四、em

一般使用么、作为响应式的标尺来计算页面中的元素大小

只要那个地方用了font-size。里面的子元素都会以这个font-size作为基准进行的em单位的换算，如果嵌套多的话就麻烦了。

 

五、rem

以html的font-size为基准

可以通过js动态动态改变html中的font-size值

Window.onload=function(){

Document.documentElement.style.fontSize=document.documentElement.clientWidth/6.4+”px”

}

Resize事件当用户企图改变浏览器的窗口大小的时候被触发

Window.addEventListener(“resize”,function(){

Document.documentElement.style.fontSize=document.documentElement.clientWidth/6.4+”px”

},false)

 

 

 

 

单页面应用指的是当用户点击跳转页面或者切换界面时，地址都不会改变改变，在一个页面中加载不同的模块来呈现不同的元素。

实现条件：1控制器。2模板。3数据解析的机制

路由：就是控制器，控制不同模板的载入和卸载，并且控制数据向模板转发。（React）

 

 

 

 

 

 

 

 

 

 

鼠标事件在移动端的时候响应速度慢300毫秒。移动端并没有点击事件这个概念。