CSS语言的基本内容
CSS（层叠样式表，Cascading Style Sheets）是一种用于描述HTML或XML（包括如SVG、MathML等各种XML方言）文档样式的样式表语言。CSS描述了如何将结构化文档（例如HTML文档或XML应用）呈现在屏幕、纸质、语音或其他媒体上。CSS与HTML和JavaScript一起构成了网页设计的三大核心技术。
CSS的基本内容包括以下几个部分：
1. **选择器（Selector）**：
选择器是CSS规则的一部分，用于选择或匹配HTML文档中的元素。常见的选择器有：
- 标签选择器（如 `h1`）
- 类选择器（如 `.classname`）
- ID选择器（如 `#idname`）
- 属性选择器（如 `input[type="text"]`）
- 伪类选择器（如 `:hover`）
- 伪元素选择器（如 `::before`）
2. **属性（Property）和值（Value）**：
属性是CSS声明的一部分，用于设置HTML元素的样式。每个属性都有一个值，该值定义了属性的设置。例如：
- `color: red;` 设置文本颜色为红色。
- `font-size: 16px;` 设置字体大小为16像素。
3. **声明（Declaration）**：
声明是属性和值对的组合，通常位于一对大括号内。一个CSS规则集可以包含多个声明。例如：
```css p { color: blue; font-size: 14px; } ```
4. **规则集（Rule Set）或规则（Rule）**：
规则集通常由一个选择器和一组声明组成。选择器指向你想要样式化的HTML元素，而声明则位于大括号内，包含一个或多个属性-值对。例如：
```css .text-bold { font-weight: bold; } ```
5. **注释（Comment）**：
CSS注释用于解释代码，并且对于浏览器来说是不可见的。注释以 `/*` 开始，以 `*/` 结束。例如：
```css /* 这是一个注释 */ p { color: red; } ```
6. **@media查询**：
@media查询允许根据不同的设备特征（如屏幕尺寸、屏幕分辨率、设备方向等）应用不同的样式规则。例如：
```css @media (max-width: 600px) { .classname { font-size: 14px; } } ```
7. **继承**：
CSS中的某些样式属性是可以被继承的，这意味着如果一个元素没有指定某个属性，它会从其父元素继承该属性。
8. **层叠和优先级**：
CSS中的“层叠”指的是当多个规则应用于同一个元素时，确定哪个规则生效的算法。CSS的优先级由选择器的特殊性、重要性（`!important`声明）、来源和顺序决定。
9. **盒模型**：
CSS基于盒模型来布局页面。每个元素都被视为一个盒子，这个盒子包括内容（content）、内边距（padding）、边框（border）和外边距（margin）。
CSS的基本内容还包括如何使用外部样式表、内部样式表和内联样式，以及如何使用各种CSS函数和单位。理解这些基本概念对于创建和维护有效的CSS代码至关重要。
