css面试题

1.说一下css的盒模型。

2.css选择器的优先级?

3.隐藏元素的方法有哪些?

4.px和rem的区别是什么?

5.重绘重排有什么区别?

重排：修改元素尺寸、位置、内容（如文本增加）、窗口大小变化、添加/删除可见DOM元素等。
重绘：修改颜色、字体、阴影、透明度等不涉及布局的属性。

6.让一个元素水平垂直居中的方式有哪些?

1、felx布局

css 复制代码

.container {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center;     /* 垂直居中 */
}

2、grid布局

css 复制代码

.container {
  display: grid;
  place-items: center; /* 同时水平垂直居中 */
}

3、绝对定位+transform

css 复制代码

.parent {
  position: relative;
}
.child {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* 修正自身宽高偏移 */
}

4、绝对定位+margin：auto

css 复制代码

.parent {
  position: relative;
}
.child {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100px; /* 需指定宽高 */
  height: 100px;
}

5、表格布局

css 复制代码

.parent {
  display: table-cell;
  text-align: center; /* 水平居中 */
  vertical-align: middle; /* 垂直居中 */
}
.child {
  display: inline-block; /* 确保内联元素居中 */
}

1.说一下css的盒模型。

6.让一个元素水平垂直居中的方式有哪些?

7.Css的哪些属性哪些可以继承?哪些不可以继承?

8.有没有用过预处理器?