目录
一.CSS基本概念：
1.1 CSS概述：
CSS指的是层叠样式表 (Cascading Style Sheets)，它可以控制网页的布局，用于渲染HTML元素标签的样式。
1.2 如何使用CSS样式：
CSS可以通过三种方式引入HTML中：
- 内联样式- 在HTML元素中使用"style" 属性
- 内部样式表 -在HTML文档头部 <head> 区域使用<style> 元素 来包含CSS
- 外部引用 - 使用外部 CSS 文件
最好使用外部引用CSS文件。
1.2.1 内联样式：
扫描二维码关注公众号，回复：
15643751 查看本文章
当特殊的样式需要使用到个别的标签时，那么可以使用内联标签
<h2 style="color:aquamarine;margin-left:auto">这是二级标题</h2>
1.2.2 内部样式：
在<head> 部分通过 <style>标签定义内部样式表，
<style> div{ background-color: aqua; color: azure; font-size: large; } </style>
1.2.3 外部样式：
引入CSS文件，把CSS样式写在CSS文件中。
<!-- 页面全局样式 --> <link rel="stylesheet" href="css/reset.css"> <!-- 首页样式 --> <link rel="stylesheet" href="css/xiaomiindex.css">
注意点：
1.三个引入方式都可以使用，但是存在优先级。首先执行：行内样式 之后就是内部样式，最后执行外部样式。
2.使用最多的是外部样式，这个稳定而且方便。
二.CSS选择器：
2.1 选择器概述
一个网页需要使用许多相同的标签，可对于这些相同的标签，我们也会需要使用CSS样式，这个时候我们该如何区别，我们使用的是哪里的标签呢？编译器该如何区分呢? ——引入CSS选择器可以有效的解决这个问题。通过对于这个标签添加一个标记，我们可以有效的区分相同的标签使用使用的不同样式。
基本的选择器有以下几种：
2. 2 标签选择器：
Ø结构：标签名 { css 属性名：属性值； }Ø 作用：通过标签名，找到页面中所有这类标签，设置样式
注意点：
1. 标签选择器选择的是一类标签，而不是单独某一个
2. 标签选择器无论嵌套关系有多深，都能找到对应的标签
代码演示：
2.2 类选择器：
Ø 结构： . 类名 { css 属性名：属性值； }Ø 作用：通过类名，找到页面中所有带有这个类名的标签，设置样式
注意点：
1. 所有标签上都有class属性，class属性的属性值称为类名（类似于名字）
2. 类名可以由数字、字母、下划线、中划线组成，但不能以数字或者中划线开头
3. 一个标签可以同时有多个类名，类名之间以空格隔开
4. 类名可以重复，一个类选择器可以同时选中多个标签
代码演示：
2.2 id选择器：
Ø 结构： #id 属性值 { css 属性名：属性值； }Ø 作用：通过 id 属性值，找到页面中带有这个 id 属性值的标签，设置样式
注意点:
1. 所有标签上都有id属性
2. id属性值类似于身份证号码，在一个页面中是唯一的，不可重复的！
3. 一个标签上只能有一个id属性值
4. 一个id选择器只能选中一个标签
2.2 通配符选择器：
Ø 结构： * { css 属性名：属性值； }Ø 作用：找到页面中所有的标签，设置样式
注意点：
1. 开发中使用极少，只会在极特殊情况下才会用到
2.可能会用于去除标签默认的margin和padding
2.3 复合型选择器：
有时候一个选择器无法满足我们的需求，这个时候需要使用一些特殊功能的选择器。
2.3.1 后代选择器：空格
Ø 作用：根据 HTML 标签的嵌套关系，选择父元素 后代中 满足条件的元素Ø 选择器语法： 选择器 1 选择器 2 { css }Ø 结果： • 在选择器 1 所找到标签的后代（儿子、孙子、重孙子 … ）中，找到满足选择器 2 的标签，设置样式