css面试试题及答案.docxVIP

css面试试题及答案

一、CSS基础与盒模型（总分：30分）

1.请简述标准盒模型（W3C标准盒模型）与IE盒模型（怪异盒模型）的区别，并说明如何通过CSS属性进行切换。

答案：标准盒模型中，元素的width和height只包含内容区域，padding和border会额外增加元素的总尺寸；而IE盒模型中，width和height包含了内容、内边距和边框的总和。可以通过设置CSS属性`box-sizing:content-box`（标准盒模型，默认值）或`box-sizing:border-box`（IE盒模型）来切换。

2.什么是BFC（块级格式化上下文）？请列举至少三种触发BFC的条件。

答案：BFC是Web页面的一个隔离的独立渲染区域，区域内外的元素不会互相影响。触发BFC的条件包括：1.根元素（html）；2.浮动元素（float不为none）；3.绝对定位元素（position为absolute或fixed）；4.display为inline-block、table-cell、table-caption或flex；5.overflow值不为visible。

3.CSS选择器的优先级是如何计算的？请举例说明。

答案：CSS选择器优先级通常通过“权重”来计算，权重由四个部分组成（从高到低）：1.内联样式（1,0,0,0）；2.ID选择器（0,1,0,0）