布局篇
左右两边固定，中间自适应（三种方法）
1、父设置 display：flex；左右设置固定宽度，中间设置flex：1；
2、左右盒子左右浮动，但在设置div中的时候必须放在左右的下面
3、子绝父相定位法 左右定位，中间定义 margin 0 auto
上下固定中间自适应
position: absolute;
top: 200px;
bottom: 200px;
**三角形原理 **
tansparent 左右加 ，低不加。
经典上固定高度满屏宽，下左固定宽满屏高下右满屏高自适应宽
左边float：left或者 position ：absolute
下右margin-left: 200px;
DIV上下左右居中方法
1、绝对定位 top50%left50% transform：translate（-50%，-50%）；
2、 父display：flex 子 margin：auto
3、父设置display：flex align-item：center justify-content：center 子设置一个盒子
清除浮动
作用：解决因为父盒子没有设置高度而引起的塌陷问题
1.overfrom：hidden/auto 出发bfc都可以
2、空div 加样式 clear：both
3、加伪类：after{clear：both content：“”}
4、加双伪类 zoom:1;//IE专有属性，解决ie6、7浮动问题
BFC
BFC创建出一个独立的区域，盒子里面和盒子外面互不影响。
创建bfc 1、overflow不为visible 2、float 不为none 3、display设置为inline-block4、position是absolute或者flex
省略号
white—space：nowrap;
overflow：hidden ;
text-overflow：ellipsis ;
语义化
就是写出的HTML代码，符合内容的结构化，选择合适的标签（代码语义化），能够便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析。
浏览器内核
trident webkit gecko presto
cookie，sessionstorage和localstorage的区别：大小时间服务器传递
cookie在浏览器和服务器间来回传递不超过4k。sessionStorage和localStorage不会； cookie是时间是否过期,数据才是否删除，sessionStorage当页面关闭才会删除数据，
localStorage除非自己删除，不然数据永久保存，cookie数据在4k以内，sessionStorage大小在5M左右，localStorage就更大了，
**常见的兼容性问题？ **
shiv 包 margin padding
**顶线中线基线底线 **
viewport的属性 HTML快捷键是mate：vp
width=device-width: 是自适应手机屏幕的尺寸宽度。
maximum-scale:是缩放比例的最大值。
minimum-scale:是缩放比例的最小值。
inital-scale:是缩放的初始化。
user-scalable:是用户的可以缩放的操作。
绝对长度单位 彼此固定，不会因为其他元素的尺寸变化而变化。
主要有cm mm Q in pc pt px 相对长度单位。
相对长度单位 指定相对于另一长度的长度。
主要有em ex ch rem %和可视区百分比长度单位 vm vh vmin vmax。
px：绝对单位，页面按精确像素展示
vw是视口的高度 1vm=视口宽度的1%
vh是视口的宽度 1vh=视口高度的1%
em是相对字体长度单位
rem是相对于根元素html的字体大小
vmin : 选取 vw 和 vh 中最小的那个
vmax : 选取 vw 和 vh 中最大的那个
百分比 相对于父元素的百分比
css3新单位，相对于视口的宽度或高度中较小的那个。其中最小的那个被均分为100单位的vm
举个例子：浏览器高度900px，宽度1200px，取最小的浏览器高度，1 vm = 900px/100 = 9 px。
其他的长度单位
in:寸
cm:厘米
mm:毫米
pt:point，大约1/72寸
pc:pica，大约6pt，1/6寸
ex：取当前作用效果的字体的x的高度，在无法确定x高度的情况下以0.5em计算(IE11及以下均不支持，
firefox/chrome/safari/opera/ios safari/androidbrowser4.4+等均需属性加么有前缀)
ch:以节点所使用字体中的“0”字符为基准，找不到时为0.5em(ie10+,chrome31+,safair7.1+,opera26+,
ios safari 7.1+,android browser4.4+支持)
