CSS 样式设计
这门课程从 CSS 规则、选择器和层叠机制讲起，逐步覆盖盒模型、背景与渐变、浮动与定位、Flexbox、Grid、表格、字体与文本、变换、过渡、动画，以及滤镜和遮罩。20 篇文章配有分节练习、中文示意图和交互实验，帮助你看清浏览器如何计算、布局并绘制页面。
CSS 负责决定页面怎样呈现：文字用什么字体，盒子占多大空间，元素如何排列，状态变化怎样过渡，多个图层又如何合成。学习 CSS 时，真正需要理解的不是属性清单，而是浏览器选择规则、计算尺寸和绘制页面的过程。
这门课程按照从基础机制到完整视觉效果的顺序组织，共有 20 篇内容。每篇都配有分节练习、中文示意图和可操作的交互实验，你可以边读边验证属性的实际行为。
课程内容
前半部分从规则语法、选择器、伪类、优先级和层叠开始，再进入值与单位、视觉格式化、盒模型、背景和渐变。学完这些内容，你会知道一条声明怎样生效，也能解释常见的尺寸、间距和覆盖问题。
布局部分包括浮动与定位、Flexbox、Grid 和表格。我们会把主轴、交叉轴、网格线、包含块和格式化上下文放到具体页面中观察，而不是只记属性值。
后半部分处理字体与文本、列表与生成内容、变换、过渡、动画，以及滤镜、混合、裁剪和遮罩。这些主题共同决定页面的排版细节、交互反馈和视觉层次。
建议的学习方式
按顺序阅读时，先看概念和代码，再打开实验调整参数。每个小节后的题目用来检查你是否理解了规则生效的条件。遇到结果与预期不同，回到开发者工具查看匹配规则、计算值、盒模型和层叠上下文，通常比反复试属性更快。