一、CSS的基本结构
CSS规则由选择器和声明块组成，基本结构如下：
selector {
property: value; /* more properties and values */
}
- 选择器（Selector）：指定要应用样式的HTML元素。
- 声明块（Declaration Block）：包含一个或多个声明，每个声明由属性和值组成，属性与值之间用冒号（:）分隔，每个声明以分号（;）结束。
二、选择器类型
CSS提供了多种选择器来定位HTML元素，包括：
- 元素选择器 ：选择所有指定的HTML元素，如
p { color: red; }选择所有<p>元素。 - 类选择器 ：选择所有指定类名的元素，使用
.表示，如.className { color: blue; }选择所有类名为className的元素。 - ID选择器 ：选择具有指定ID的元素，使用
#表示，如#idName { color: green; }选择ID为idName的元素。 - 复合选择器 ：
- 后代选择器 ：选择某个元素内的所有指定元素，使用空格分隔，如
div p { color: yellow; }选择所有在<div>内的<p>元素。 - 子选择器 ：选择某个元素的直接子元素，使用
>分隔，如ul > li { color: purple; }选择所有<ul>的直接子元素<li>。 - 相邻兄弟选择器 ：选择紧接在某元素后的指定元素，使用
+分隔，如h1 + p { color: orange; }选择紧接在<h1>后的第一个<p>元素。 - 通用兄弟选择器 ：选择某元素后面的所有指定元素，使用
~分隔，如h1 ~ p { color: pink; }选择<h1>后的所有<p>元素。
- 后代选择器 ：选择某个元素内的所有指定元素，使用空格分隔，如
- 伪类选择器 ：选择特定状态的元素，如
:hover选择鼠标悬停状态的元素，:first-child选择父元素的第一个子元素。 - 伪元素选择器 ：选择元素的特定部分，如
::before和::after用于在元素内容的前后插入内容。
三、常用CSS属性
CSS提供了丰富的属性来控制网页的样式，包括但不限于：
- 字体样式 ：
font-family、font-size、font-weight、font-style等。 - 文本样式 ：
color、text-align、text-decoration、text-indent、line-height等。 - 背景样式 ：
background-color、background-image、background-repeat、background-position、background-size等。 - 盒模型 相关：
border、margin、padding、width、height等。 - 布局与定位 ：
display（如block、inline、flex、grid）、position（如static、relative、absolute、fixed）、top、right、bottom、left、z-index等。
四、CSS单位
CSS支持多种单位，包括：
- 绝对单位 ：如
px（像素）、cm（厘米）、mm（毫米）、in（英寸）、pt（磅）、pc（派卡）。 - 相对单位 ：如
em（相对于元素的字体大小）、rem（相对于根元素<html>的字体大小）、vw（视口宽度的百分比）、vh（视口高度的百分比）、vmin、vmax（相对于视口较小或较大的那一个百分比）。
五、CSS的编写位置
CSS的编写位置主要有三种：
- 行内样式 ：直接写在HTML元素的
style属性中，只影响当前元素。 - 内部样式 ：将CSS代码写在HTML文档的
<head>部分内的<style>标签中，影响当前页面的所有元素。 - 外部样式 ：将CSS代码写在单独的
.css文件中，然后在HTML文件中通过<link>标签引入，可以跨页面复用样式，实现结构与样式的分离。