CSS 面试题

186 阅读1分钟

1. 两种盒模型分别说一下

box-sizing:border-box; // IE 盒模型
box-sizing:content-box;  //标准盒模型

比较喜欢用哪一种,为什么,随便说个理由,顺手了。

盒模型 MDN

2. 如何垂直居中?(必考)

个人总结的垂直居中方法

实际上 Flex 可以实现完美,也是我最常用的一种。

3. flex 怎么用,常用属性有哪些?

MDN Flex 参考

Flex 布局教程 阮一峰

4. BFC 是什么?

块级格式化上下文 BFC 完整参考 MDN

BFC 触发条件

  1. 根元素( html )
  2. 绝对定位元素(元素的 position 为 absolute 或 fixed)
  3. 行内块元素
  4. overflow 值不为 visible 的块元素
  5. 浮动元素(元素的 float 不是 none)
  6. 弹性元素(display为 flex 或 inline-flex元素的直接子元素)

5. CSS 选择器优先级

  1. 越具体优先级越高
  2. 同样优先级写在后面的覆盖写在前面的
  3. !important 优先级最高,但是要少用

6. 清除浮动说一下

背代码,父元素加上 clearfix 类

 .clearfix:after{
     content: '';
     display: block; /*或者 table*/
     clear: both;
 }
 .clearfix{
    zoom: 1; /* IE 兼容*/
 }

后记

只提供个人找到或者总结的答案,想要深入了解,请自己 mdn 搜相关知识点。

转载请注明出处,谢谢。

个人总结,不足之处还请指出。

以上