| 描述 | |
| 1 | 如果图片下面有奇怪的底部margin，可以添加一个 vertical-aligh：middle。 |
| 2 | 以后使用：margin-left：auto，margin-right：auto 来代替 margin 0 auto 实现居中效果吧。 |
| 3 | float 布局最好不要给外层的 container 设置宽度，让其自由撑开，或者不要给内部的横向最后的元素设置宽度。 |
| 4 | width 和 height 属性尽量别写死，最好使用 min-width/max-width/min-height/max-height 代替，或把 px 换成 %、vw。 |
| 5 | 写样式的时候可以简写，充分利用 tab 键来提高编码速度，比如 pos：a + Tab 就是 position：absolute。 |
| 6 | 设置浮动 float 或定位 position:absolute/fixed 的元素会脱离文档流。 |
| 7 | css 文件中必要的语法：@charset"UTF-8"；@import url（2.css）；@media（mkn-width：100px）and（max-width：200px）{语法一} |
| 8 | 文档流：元素流动方向，inline 元素从左到右，到达最右边才会换行，block元素从上到下，每一个都独占一行，inline-block也是从左到右，但是不会分块，不会断开。 |
| 9 | 宽度：inline 元素的宽度为内部 inline元素的和，不能设置 width 属性。block 元素默认自动计算宽度 auto。inline-block 元素结合前两者特点，默认情况下宽度由内部元素决定，可设置 width 属性。忠告：最好不要给 block 块元素指定 width 为 100%。 |
| 10 | 高度：inline 元素的高度由 line-height 间接确定，跟 height无关，如果字体不一致，它的实际高度可能不一致。block 元素的高度由内部文档流元素决定（没有内容高度为 0），可以设置 height 属性，如果设置的高度比实际的内容高度要低，就会溢出，可以通过设置 overflow 属性来解决溢出的问题。inline-block 元素的高度跟 block 类似，可以设置 height 属性。 |
| 11 | overflow 的几个属性值：默认 visible，可以看到溢出的内容。hidden，隐藏溢出的内容。scroll，超出的话增加滑动条（但是这个属性会有一个缺陷，即使你的内容没有溢出，他也会显示滚动条，酌情使用）。auto，推荐使用该属性，超出增加滚动条，不超不滚。 |
| 12 | 层叠上下文：由下层到上层依次是：z-index 负 > background > border > 块级子元素 > 浮动元素 > 内联元素 > 定位元素 > z-index 0、正； |
| 13 | 浏览器渲染过程：（1）根据 HTML 构建 HTML 树（DOM），（2）根据 CSS 构建 CSS 树（CSSOM），（3）将两棵树合并成一颗渲染树（render tree），（4）Layout 布局（文档流、盒模型、计算大小和位置），（5）Paint 绘制（把边框颜色、文字颜色、阴影等画出来），（6）Compose 合成（根据层叠关系展示画面）。推荐文章：传送门 。 |
| 14 | |
