网站的“颜值” - CSS

想更加系统的学习可以看看这个教程：https://www.runoob.com/html/html-css.html

在我们使用“装修利器” Tailwind CSS 之前，让我们先花十分钟，快速了解一下 CSS 最传统、最基础的工作方式。这对于你理解“样式”的本质至关重要。

1、传统装修的“三要素”

传统 CSS 的工作方式，就像是你写了一本独立的《装修设计规范手册》，然后告诉 HTML 骨架去遵守这本手册。这本手册里的每一条规则，都由三个核心要素构成：

1. 选择器 (Selector)：你要装修“谁”？

这是规则的第一部分，它会精准地选中页面上的一个或多个元素。比如 h1 就是选中所有的一级标题，.card 就是选中所有带有“card”这个外号的盒子。

1. 属性 (Property)：你要装修“哪个方面”？

选中目标后，你需要指明要改变它的哪个视觉特征。比如 color (文字颜色)、font-size (字号大小)、background-color (背景颜色)。

1. 值 (Value)：你想把它装修成“什么样”？

这是对属性的具体设定。比如 color 的值可以是 blue (蓝色)，font-size 的值可以是 24px (24像素)。

把这三者合起来，就成了一条完整的 CSS 规则，它看起来是这样的：