8、box-sizing：content-box | border-box border-box即使定义了border和padding也不会改变对象的实际宽度
7、background-clip:padding-box; 背景绘制区域
6、ul li 内容只设置font-size 行高用padding代替 距上面高度
5、消除ul 前的点 可以设置font-size:0;
4、white-space: nowrap 段落中的文本不进行换行：
3、float漂浮的元素，设置vertical-align: middle;垂直居中
2、autofocus
查看鼠标焦点目标位置
1、适配 水平垂直居中
initial-scale 页面初始缩放
minimum-scale=1 最小缩放
maximum-scale=1 最大缩放
user-scale=no 用户缩放
布局viewport = 设备宽度 = 度量viewpor
.mid {/*不等宽的水平垂直居中*/
position:absolute;
top:50%;
left:50%;
z-index:3;
transform:translate(-50%,-50%);
border-radius:6px;
background:#fff;
}
.mid2 {
justify-content: center;/*子元素水平居中*/
align-items: center;/*子元素垂直居中*/
display:-webkit-flex;
}
.intwoline {/*多行文本溢出*/
display:box !important;
overflow:hidden;
text-overflow:ellipsis;
word-break:break-all;
-webkit-box-orient:vertical;
-webkit-box-lines-clamp: 2;
}
1、怎么撑开float div元素 外部的包裹div 1、外部div css设置overflow:hidden 2、底部<div class="clear"></div> 清除浮动
2、div 内容均匀分布 如果元素不是灵活的项目，则 flex 属性不起作用。
外部div display:flex; 内部
如：#main div
{
flex:1;
}
其中，ltr是初始值，表示left-to-right，就是从左往右的意思，再具体描述下，就是内联内容是从左往右依次排布的，我们平时网页的处理都是这样的，比方说前后两个图片，默认情况下，DOM在前的就显示在左边。
rtl则是另外一个值，right-to-left缩写，就是从右往左的意思，再具体描述下，就是内联内容是从右往左依次排布的，加入应用了这个CSS声明，则前后两个图片，默认情况下，DOM在前的就显示在右侧；而且是在容器的右端。
html body 默认的高宽是0 由内容给撑开。 采取绝对定位是：宽度 高度用100%
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 以ie,谷歌内核解析
<meta name="format-detection" content="telephone=no"> 手机上数字不可以拨号
png和jpg 作为背景时，png图片在上。
background-size:100%; 背景随着div变化
对ol列表 排序标记
list-style-position: inside; 数字排序
list-style-position: inside; 左对齐
px em rem 定义比较：
px ：像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的
em ：是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸
任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。为了简化font-size的换算，需要在css中的body选择器中声明Font-size=62.5%，这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了
rem ：是CSS3新增的一个相对单位（root em，根em） 相对浏览器 根目录
zoom
:1;属性是IE浏览器的专有属性，Firefox等其它浏览器不支持。它可以设置或检索对象的缩放比例。除此之外，它还有其他一些小作用，比如触发ie的hasLayout属性，清除浮动、清除margin的重叠等