定义
层叠样式表是一种样式表语言，用于描述以超文本标记语言(HTML)或可扩展标记语言(XML)编写的文档的视觉呈现，包括颜色、字体排印、间距、布局和动画等[1]。它通过允许作者在文档语义结构之外单独指定这些外观属性，把内容与样式分离开来[1]。一份样式表由若干条规则组成，每条规则包含一个选择器和一组声明；选择器说明规则作用于哪些元素，声明则由属性与取值构成[3]。
样式表可以存放在文档之外单独的文件中，既可以换用另一份样式表来改变同一文档的呈现，也可以把同一份样式表应用到多个文档上[4]。这种“层叠”能力指的是多份来自作者与读者的样式表可以被合并，共同决定最终的呈现效果[4]。
原理
一条最简单的样式表规则形如 $H1 \{ color: blue \}$，其中 H1 是选择器，color 是属性，blue 是取值[3]。选择器是文档与样式之间的连接点，所有 HTML 元素类型都可以作为选择器[3]。除按元素类型选择外，还可以按类名、标识符、属性、伪类以及元素之间的结构关系来匹配元素[1]。
当多条规则同时命中一个元素时，由“层叠”决定哪一条生效，判定依据包括样式表的来源（浏览器默认、用户或作者）、选择器的特异性以及规则出现的先后顺序[1]。特异性由选择器中标识符、类和元素标记的数量计算得出，因此单个标识符选择器的权重高于任意数量的类选择器[1]。此外，部分属性会由父元素传递给子元素，而背景、外边距等盒子相关属性通常不继承[3]。
浏览器渲染时，每个元素被表示为一个矩形盒子，盒模型由内容区、内边距、边框和外边距依次包围而成[5]。文档布局中元素的位置由文档流、浮动、定位以及弹性盒、网格等布局机制共同决定[5]。
发展历程
在 CSS 出现之前，网页外观主要依靠 HTML 的展示类标签和属性来控制，结构与样式混杂在一起，大规模维护困难[1]。当时已经存在若干样式表语言的提案，例如 Pei Wei 为 Viola 浏览器设计的语言，以及出版机构 O'Reilly 的 Robert Raisch 早在1993年6月写出的方案[2]。
1994年，哈肯·维姆·莱提出 CSS 的最初建议；伯特·波斯当时正在开发名为 Argo 的浏览器，也持有自己的样式表提案，两人随后决定合并方案、共同设计[2]。同年11月，最初方案在美国芝加哥的 Web 会议上作了展示[2]。CSS 区别于其他提案之处在于，它承认网页样式不能由作者或读者单方面决定，双方意愿需要以某种方式合并，即“层叠”[2]。
1995年4月，在德国达姆施塔特举行的 WWW 会议上 CSS 再次被介绍，波斯演示了 Argo 浏览器的支持，莱演示了支持 CSS 的 Arena 浏览器[2]。同年5月，讨论样式表的 www-style 邮件列表建立；万维网联盟(W3C)也于1995年开始运作，并就样式表主题组织了研讨会[2]。1995年11月6日至7日，W3C 在法国罗康库尔举办了样式表研讨会。
1996年12月17日，W3C 发布层叠样式表第一级(Cascading Style Sheets Level 1，CSS1)作为推荐标准，其中定义了字体、颜色、文本、内外边距、定位等基础属性。1997年初，W3C 成立专门负责 CSS 的工作组，开始讨论第一版未涉及的问题。1998年5月，CSS 第二级(CSS2)作为推荐标准发布，它在 CSS1 基础上扩充了媒体相关样式表、内容定位、表格布局等能力，CSS1 中有效的样式表绝大多数在 CSS2 中依然有效[6]。
此后该语言改为按模块分别制定和推进，颜色、选择器、变换、动画、网格布局等模块各自沿 W3C 推荐标准流程独立发展，使单项能力无需等待整体版本即可实现稳定和普及[1]。
应用
层叠样式表被广泛用于网站和网页应用的视觉设计与品牌呈现，以及适配手机、平板和桌面等不同视口尺寸的响应式布局[1]。通过媒体查询，样式的生效可以取决于屏幕宽度等媒体特征，从而实现同一份内容在不同设备上的差异化排版[5]。
它也被用于打印样式表，以控制打印输出的分页和页边距；用于构建带视觉焦点指示和高对比度主题的无障碍界面组件；以及借助过渡和关键帧动画实现动画界面与数据可视化[1]。CSS 本身即为排版而设计，与 CSS 相关的书籍也曾采用 HTML 加 CSS 的方式排版，再转换为便携文档格式输出[7]。
局限
层叠样式表是一种声明式而非编程式的语言，它描述期望的呈现结果，本身不具备通用的计算与控制能力，需要依附于文档才能发挥作用[4]。不同浏览器对同一规则的解释和渲染可能不一致，跨浏览器兼容性因此长期存在，开发者有时需要为特定浏览器编写样式或使用厂商前缀[8]。
选择器特异性和层叠规则本身也构成使用难点，规则冲突时究竟哪一条获胜不易直观判断，可能产生出乎预期的效果[8]。盒模型、浮动和定位等属性的行为对初学者不够直观，实现复杂布局和精确定位较为费力，响应式设计在大规模复杂项目中也会增加额外难度[8]。
媒体查询只能依据视口等全局条件生效，无法直接依据组件自身尺寸来调整样式，因此用媒体查询难以模块化地构建可复用、脱离上下文独立自适应的响应式组件[9]。
参见
参考资料
- Cascading Style Sheets | IEEE Technology Navigator [引用日期2026-10-14]
- Cascading Style Sheets, designing for the Web [引用日期2026-10-14]
- Cascading Style Sheets, level 1 - REC-CSS1-20080411 [引用日期2026-10-14]
- Cascading Style Sheets: fifth draft specification [引用日期2026-10-14]
- CSS中的这些基础概念你知道多少？ [引用日期2026-10-14]
- cover [引用日期2026-10-14]
- Cascading Style Sheets [引用日期2026-10-14]
- Does Anyone Love CSS? [引用日期2026-10-14]
- arxiv.org 上的网页 [引用日期2026-10-14]