本文共 1020 字，大约阅读时间需要 3 分钟。

CSS基础理论知识

致自己的复习笔记

1. 什么是CSS？

CSS全称为层叠样式表（Cascading Style Sheets），又称风格样式表，是用来进行网页风格设计的重要工具。

2. CSS的优势

CSS具有以下显著优势：

1. 内容与表现分离，提升开发效率

2. 视觉风格的统一性，确保页面整体美观

3. 提供丰富的样式选择，增强布局灵活性

4. 减少重复代码，降低网页加载时间

5. 便于维护和管理，提升长期可维护性

3. 外部样式表链接式与导入式的区别

link标签和@import用于导入外部样式表，但两者在加载方式上存在差异：

1. link标签：外部CSS文件加载完成后才展示给浏览器，确保样式表在页面渲染前加载

2. @import：首先展示HTML结构，随后加载并编译外部CSS文件

4. 样式优先级

CSS样式的应用顺序遵循以下规则：

行内样式> 内部样式表> 外部样式表

5. CSS3的基本选择器及优先级

CSS3中的基本选择器及其优先级：

标签选择器、类选择器、ID选择器

优先级：ID选择器> 类选择器> 标签选择器

6. CSS3高级选择器

CSS3引入了一系列高级选择器，包括：

层次选择器

结构伪类选择器

属性选择器

7. nth-child(n)与nth-of-type(n)的区别

两个选择器的主要区别在于：

nth-child(n)：基于元素的位置（不考虑元素类型）

nth-of-type(n)：基于元素的类型和位置

8. 网页字体设置有什么要求？

在设置网页字体时，需注意：

中英文字体顺序设置错误会导致英文字体无法正确应用

建议中英双字体时，将英文字体设置在中文字体之前

9. 解决父级边框塌陷的方法

解决父级边框塌陷的常用方法包括：

1. 在浮动元素后添加空白div

2. 设置父元素的高度

3. 父级添加overflow属性

10. CSS中的3种基本定位机制

CSS中的定位机制主要包括：

标准流定位（默认行为）

浮动定位

绝对定位

11. 相对定位、绝对定位、固定定位的区别

三种定位方式的主要区别和特点如下：

相对定位：相对于自身初始位置，适用于配合绝对定位使用

绝对定位：相对于父级或浏览器窗口，元素脱离文档流

固定定位：相对浏览器窗口，位置不随滚动而变化

12. 过度的触发机制

CSS中的过度触发机制主要包括：

1. 伪类触发

2. 媒体触发

3. JavaScript触发