优快云

一、什么是盒子模型CSS盒子模型（Box model）是利用CSS技术进行网页设计时所使用的一种思维模型。它将网页中的每个元素都看成一个盒子，每个盒子具备以下四个属性：margin(外边距)padding(内边距)border(边框)content(内容)...

一、常见定位方案1. 普通流(normal flow)元素按照其在HTML中的先后位置至上而下布局行内元素水平排列，直到当行被占满然后换行，块级元素则会被渲染为完整的一个新行所有的元素默认都是普通流定位可以说，普通流中元素地位置由该元素在HTML文档中的位置决定2. 浮动(float)元素首先按照普通流的位置出现，然后根据浮动的方向尽可能地向左边或右边偏移3. 绝对定位(absolute positioning)元素会整体脱离普通流，因此绝对定位不会对其兄弟元素造成影响二、

一、z-indexz-index属性用于设置元素的堆叠顺序，拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。其在不设置时默认为auto，设置时只能取整数，如”-2，-1，0，1，2，…”。该属性设置一个定位元素沿z轴的位置，z轴定义为垂直延申到显示区的轴。如果为正数，则离用户更近，为负数则表示离用户更远。注意：z-index只对指定了position属性的元素生效当没有指定z-index时，所有元素都会被渲染在默认层（0层）二、什么是层叠上下文层叠上下文（stacking c

水平居中子元素是行内元素，父元素是块元素[父]：text-align: center子元素是块级元素（已知宽度）[子]：margin: 0 auto设置父元素为相对定位[子]：absolute + transformposition: absolute;left: 50%;transform: translateX(-50%);父元素添加：flex + justify-content:center垂直居中单行的行内元素[子]：line-height: height设置父元素

一、什么是高度坍塌一般而言，父级元素不设置高度时，高度由随内容增加自适应高度。当父级元素内部的子元素全部都设置浮动float之后，子元素会脱离标准流，不占位，父级元素检测不到子元素的高度，父级元素高度为0。二、解决方案1. 为父元素添加声明overflow: hidden【原理】详见BFC四、2【缺点】不能和position定位配合使用，超出的尺寸会被隐藏2. 在浮动元素下方添加空div，并给元素声明clear：both【原理】写入了clear: both的元素不允许周围有浮动的元素产生，所

一、什么是伪类与伪元素依据官方对其的描述：CSS引入伪类和伪元素概念是为了格式化文档树以外的信息。也就是说，伪类和伪元素用来修饰不在文档树中的部分。伪类用于当已有元素处于的某个状态时，为其添加对应的样式，这个状态是根据用户行为而动态变化的。比如说，当用户悬停在指定的元素时，我们可以通过:hover来描述这个元素的状态。虽然它和普通的 CSS 类相似，可以为已有的元素添加样式，但是它只有处于文档树无法描述的状态下才能为元素添加样式，所以将其称为伪类。伪元素用于创建一些不在文档树中的元素，并为其添加样式。

1. px像素（pixel）的缩写，图像中不可分割的最小单位，绝对长度2. em相对长度，以父元素的font-size为参照 <div style="font-size: 16px;"> 第一层 <div style="font-size: 1em;"> 第二层 <div style="font-size: 2em;"> 第三层