综合前端面试题及答案.docxVIP

综合前端面试题及答案

一、HTML与CSS基础（总分：20分）

1.请简述标准盒模型（W3C标准盒模型）与IE盒模型（怪异盒模型）的区别，以及在CSS中如何设置盒模型类型。

答案：标准盒模型的宽高仅包含内容区域（content），padding和border会额外增加元素的尺寸；IE盒模型的宽高包含内容、padding和border，width属性直接决定了元素的总宽高。在CSS中，可以通过设置`box-sizing:content-box`（标准盒模型，默认值）或`box-sizing:border-box`（IE盒模型）来指定。

2.什么是BFC（块级格式化上下文）？请列举触发BFC的条件及其主要作用。

答案：BFC是Web页面的一个隔离的独立渲染区域，内部元素的布局不会影响外部元素。触发条件包括：根元素、浮动元素（float不为none）、绝对定位元素（position为absolute或fixed）、行内块元素（display为inline-block）、`overflow`值不为visible的元素。主要作用包括：清除内部浮动、防止margin重叠、隔离DOM元素。

3.在Flex布局中，`justify-content`和`align-items`属性分别控制什么？请举例说明`flex:1`的含义。

答案：`justify-conten