box-sizing:border-box 包括边框尺寸
例如一个宽度300px的div被border所包围则
背景的宽度：width+border*2
outline 外边框
border-collapse:collapse;去掉表格间距
border-spacing 表格间距
empty-cells：hide
background-clip：context-box （ 设置裁剪的位置，边框底下没有背景图片和颜色 默认是有的）
background-origin 设置图片的原点
rgba , background：transparent 颜色透明
opacity 元素整体透明
文档流 从左向右 从上到下
line-height 与 padding都可以设置垂直居中
块级元素的宽度=父元素.width=outline+margin+padding+border+width
width:inherit 继承父类
图片放在容器：
background-size:contain;
（width：100% height：100%
object-fit：contain
）
选择器 id选择器>类选择器>标签选择器
标签元素：0001
类选择器：0010
id选择器：0100
伪类选择器：0002
行内标签：1000
空格+！important 不论优先级多高 ，加上就会覆盖掉原来样式
absolute 原点坐标 为非 static 父元素的左上角
fixed 原点坐标为body的左上角
脱离文档流：fixed absolute
不脱离文档流：static relative
link 和@import区别
link属于XHTML标签，而@import是css提供的
页面加载时，link同时也会被加载，而import等页面加载完成才进行加载
#div+div 紧跟在div后面的一个兄弟元素
#div>div 直接的子元素
属性选择器
[]* *是包含的意识
[]^ ^是以什么开头的
[]$ $是以什么结尾的
【id】选择具有id属性的所有元素
【id=‘ ’】
a:link 所有href属性
伪类顺序不同为什么产生不同结果
权重是相同的 active 包括了 link hover
link visited hover active
text-align,line-height 都用于行内元素
屏幕大小1170 950（970） 750
小图 用contain：适应容器大小 大图 用 cover ：覆盖 多余hidden
font-weight normal 400 bold 700 bolder 900
visibility ：hidden 透明度为0 ， display 销毁
父容器中设置overflow：hidden 解决高度塌陷
子容器最后添加一个空的div设置 clear:both 清除俩边的浮动（一般right无用，独占一行）
div设置 contenteditable=true 可以对div文本进行编辑
浏览器引擎不同 写法 优雅降级 线性增强
display:flex;
主轴方向： justify-content
交叉轴： align-items
display:flex 写在父元素中 min-windth :最小宽度 不想让它存在2个或4个
viewport: 应用于移动端，不允许改变底层窗口的大小，解决了苹果的物理尺寸与逻辑尺寸 的问题 ，与安卓一样都使用物理尺寸
手机 默认边距15px pc默认边距8px
box-showder + boder-radius 实现内外圆角
不使用 flex 可以使用display：table-cell （类似于表单） 及支持IE8以及现代流行浏览器，ie6/7则不行，也会使float失效
