1、CSS样式基础
CSS定义：Cascading Style Sheets（层叠样式表）是用于描述HTML或XML等文件样式的计算机语言。它可以静态修饰网页，也能配合脚本语言动态格式化网页元素。
CSS功能：能精确控制网页元素位置排版，支持多种字体和字号样式，并具备对网页对象和模型样式的编辑能力。
2、样式表类型
嵌入样式表：在HTML文件的
标签内使用标签定义CSS样式，直接作用于当前HTML文件。外部样式表：通过
`标签或@import`规则引入外部的CSS文件，实现样式的复用和统一管理。内联样式：直接在HTML元素内部使用
style属性定义CSS样式，作用于单个元素。
3、CSS注释
使用/* */进行注释，可以跨越多行。
4、样式选择器
元素选择器：直接选择HTML元素，如
div {属性:值}。ID选择器：通过元素的ID属性选择元素，如
#id {属性:值}。类选择器：通过元素的class属性选择元素，如
.类名 {属性:值}。子选择器：选择某元素的直接子元素，如
元素 空格 子元素 {属性:值}。后代选择器：选择某元素的后代元素，如
元素 > 子元素 {属性:值}。属性选择器：根据元素的属性选择元素，如
元素[属性] {属性:值}。通配符选择器：选择所有元素，如
* {属性:值}。群组选择器：同时选择多个选择器对应的元素，如
选择器1, 选择器2 {属性:值}。
5、背景属性
background-color：设置背景颜色。
background-position：设置背景图像的位置。
background-size：设置背景图像的大小。
background-repeat：设置背景图像的重复方式，如
repeat、repeat-x、repeat-y、no-repeat。background-origin：设置背景图片的定位区域。
background-clip：设置背景的绘制区域。
background-attachment：设置背景图像是否固定或随页面滚动。
background-image：设置要使用的背景图像。
background：简写属性，可以同时设置以上所有背景属性。
6、边框属性
border-color：设置边框颜色。
border-width：设置边框宽度。
border-style：设置边框样式，如
none、hidden、dotted等。border-left、border-right、border-top、border-bottom：分别设置四个方向的边框样式。
7、 文字属性
color: 用来设置文本的颜色。例如，
color: red;会将文本颜色设置为红色。font-size: 用来设置文本的大小。通常以像素（px）为单位。例如，
font-size: 16px;会将文本大小设置为16像素。font-weight: 用来设置文本的粗细。常见的值有
normal（正常）和bold（加粗）。font-family: 用来设置文本的字体。可以指定具体的字体名称，如
font-family: "宋体";，或者使用通用的字体族，如serif、sans-serif等。font-variant: 用来设置文本的小写字母是否以大写字母显示。例如，
font-variant: small-caps;会将小写字母转换为小型大写字母。
8、 文本属性
text-align: 用来设置文本的水平对齐方式。可选的值有
left（左对齐）、right（右对齐）、center（居中对齐）和justify（两端对齐）。line-height: 用来设置文本的行高，即行与行之间的距离。这也可以用来实现文本的垂直居中。
text-indent: 用来设置文本的首行缩进。例如，
text-indent: 2em;会将文本的首行缩进两个字符的宽度。text-decoration: 用来设置文本的装饰线。常见的值有
none（无装饰线）、underline（下划线）、overline（上划线）和line-through（穿过文本的线）。letter-spacing: 用来设置文本中字母或字符之间的间距。
word-spacing: 用来设置文本中单词之间的间距。
text-transform: 用来设置文本的大小写转换。例如，
text-transform: uppercase;会将文本转换为大写字母。
9、块元素属性
块级元素会形成一个新的“块”，在其前后都可能有换行符（如 ,, -, ,, `` 等）。块级元素的主要属性通常与布局和尺寸有关，例如：
width：设置元素的宽度。
height：设置元素的高度。
margin：设置元素的外边距。
padding：设置元素的内边距。
border：设置元素的边框。
display：设置元素的显示方式，例如
block（块级）、inline（内联）、none（不显示）等。
10、超链接属性
超链接通常使用 `` 标签创建，其属性主要与链接的样式和行为有关，例如：
color：设置链接文本的颜色。
text-decoration：设置链接文本的装饰，如下划线、无装饰等。
background-color：设置链接的背景色。
hover：伪类选择器，用于设置鼠标悬停在链接上时的样式。
active：伪类选择器，用于设置链接被点击时的样式。
visited：伪类选择器，用于设置已访问链接的样式。
11、列表属性
列表通常使用 （无序列表）和（有序列表）标签创建，列表项使用 `` 标签。列表的CSS属性主要影响列表的显示方式，例如：
list-style-type：设置列表项标记的类型，如圆点、数字等。
list-style-position：设置列表项标记的位置，如内部或外部。
list-style-image：使用图像作为列表项标记。
list-style：简写属性，用于设置上述所有列表样式属性。
12、溢出属性
溢出属性 overflow 用于确定当内容溢出其块级容器时如何处理，例如：
visible：默认值，内容不会被修剪，会呈现在元素框之外。
hidden：内容会被修剪，并且其余内容是不可见的。
scroll：内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
auto：如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
13、定位属性
定位属性允许你控制元素在页面上的位置，主要有以下几种：
position：设置元素的定位类型，如static（静态）、relative（相对）、absolute（绝对）和fixed（固定）。top、right、bottom、left：用于设置定位元素相对于其定位上下文的位置。z-index：设置元素的堆叠顺序（即哪个元素应该位于前面或后面）