DIV+CSS 前端面试题及详细答案（实战完整版）.docxVIP

DIV+CSS前端面试题及详细答案（实战完整版）

一、基础核心面试题

1、谈谈你对DIV+CSS布局的理解？和传统table布局的区别？

参考答案：

DIV+CSS是现在主流的网页布局方式，核心思想是结构与样式分离。HTML标签负责搭建页面结构、承载内容，CSS专门负责控制页面的样式、布局、配色、间距等视觉效果。

和table布局的核心区别：

结构清晰度：table布局依靠表格嵌套，代码冗余、层级混乱；DIV+CSS代码简洁，结构语义化更强，可读性高。

维护成本：table样式和结构混杂在一起，修改一处样式可能改动整个表格；CSS统一管理样式，全局修改、局部调整都很方便。

加载速度：table表格需要完整加载完所有内容才会渲染页面；DIV布局是边加载边渲染，页面展示速度更快。

适配性：table布局很难适配移动端、响应式场景；DIV+CSS可以灵活适配不同屏幕尺寸，适配性极强。

SEO优化：结构清晰的DIV布局更利于搜索引擎抓取页面内容，table嵌套冗余代码会影响收录权重。

2、CSS选择器有哪些？优先级如何计算？

参考答案：

常用CSS选择器分为五类：

通用选择器：*，匹配页面所有标签

标签选择器：div、p、span，匹配对应标签

类选择器：.class，匹配对应类名标签，最常用

ID选择器：#id，匹配唯一id标签