>浮动 相对于整个页面漂浮起来了 - 浮动的目的 让元素并排显示 - 高度坍塌 子元素float,父元素的高度会坍塌 1.clear:both 2.给父元素设置overflow:hidden;(推荐，自己的问题自己解决) 只要浮动就给他爸爸 新特性 box-sizing:border-box 给border,padding不会改变它的width,height >定位 position - 相对定位(relative) 就是元素在页面上的正常的位置,通过left，top可以改变它的位置 - 绝对定位(absolute) 1.绝对定位元素师相对于最近的给了定位的父元素 2.如果上级没有元素定位，那他的位置相对于整个html页面 >flex display:flex; flex-direction; //方向row,colum; align-items; //控制子元素水平对齐的方法 flex-warp //子元素是否换行 justify-conten;排列方式space-between space-around space-eventy flex //把剩余的部分按比例自适应 - 掌握iconfont