关于CSS

CSS（Cascading Style Sheets，层叠样式表）是为 web 内容添加样式的代码。和 HTML 类似，CSS 也不是真正的编程语言，甚至不是标记语言。CSS 是一门样式表语言，这也就是说人们可以用它来选择性地为 HTML 元素添加样式。

“CSS 规则集”详解

整个结构称为规则集（规则集通常简称规则），注意各个部分的名称：

• 选择器（Selector）

  HTML 元素的名称位于规则集开始。它选择了一个或多个需要添加样式的元素（在这个例子中就是 <p> 元素）。要给不同元素添加样式，只需要更改选择器。

• 声明（Declaration）

  一个单独的规则，如 color: red; 用来指定添加样式元素的属性。

• 属性（Properties）

  改变 HTML 元素样式的途径（本例中 color 就是 <p> 元素的属性）。CSS 中，由编写人员决定修改哪个属性以改变规则。

• 属性的值（Property value）

  在属性的右边，冒号后面即属性的值，它从指定属性的众多外观中选择一个值（我们除了 red 之外还有很多属性值可以用于 color ）。

注意其他重要的语法：

• 除了选择器部分，每个规则集都应该包含在成对的大括号里（{}）。
• 在每个声明里要用冒号（:）将属性与属性值分隔开。
• 在每个规则集里要用分号（;）将各个声明分隔开。

CSS：一切皆盒子

编写 CSS 时你会发现，你的工作好像是围绕着一个一个盒子展开的——设置尺寸、颜色、位置，等等。页面里大部分 HTML 元素都可以被看作若干层叠的盒子。

CSS 布局主要是基于盒子模型。在你的页面上占用空间的每个盒子都有类似的属性：

• padding（内边距）：是指内容周围的空间。在下面的例子中，它是段落文本周围的空间。
• border（边框）：是紧接着内边距的线。
• margin（外边距）：是围绕元素边界外侧的空间。

总结

单纯讲CSS的话，需要了解其属性、选择器、盒子模型等，结合项目使用就需要使用预处理器，例如less、scss等库，使得编写CSS更加灵活、高效。