CSS20230512
# 什么是Css
如何学习
1.CSS是什么
2.CSS怎么用 (快速入门)
3.CSS 选择器(重点 + 难点)
4.美化网页 (文字，阴影，超链接，列表,渐变....)
5.盒子模型
6.浮动
7.定位
8.网页动画 (特效效果)
## 一、什么是CSS
### 1.1、CSS是什么
#### cascading style sheet 层叠级联样式表
html：内容层
css：表现层 美化网页
### 1.2、发展史
- CSS1.0
- CSS2.0 DIV（块）＋CSS，HTML与CSS结构分离的思想，网页变得简单，SEO
- CSS2.1 浮动，定位
- CSS3.0 圆角，阴影，动画．I．浏览器兼容性
### 1.3 css的优势：
#### 1、内容和表现分离
#### 2、网页结构表现统一，可以实现复用
#### 3、样式十分的丰富
#### 4、建议使用独立于html的css文件
#### 5、利用SEO，容易被搜索引擎收录！ Vue
#### 6、样式表示例，style标签与css文件
## 二、CSS怎么用-四种导入方式
CSS的四种导入方式
#### 层叠样式表（CSS）可以通过三种方式与 HTML 文档进行关联：
#### 1.内部样式。
在 HTML 的head标签中使用 <style> 标签，将 CSS 样式直接嵌入到 HTML 文件中。
#### 2.外部样式。
在 HTML 的head标签中中使用 <link> 标签，将 CSS 文件与 HTML 文件进行链接。
#### 3.行内样式。
在 HTML的body标签中使用style属性，直接在标签内部添加 CSS 样式。
#### 5、外部样式的第二种import导入方法
外部样式
外部样式的两种写法
1head 标签内写link
2 @import方式导入
## 三、CSS选择器
选择器：选择页面上的某一种/个/类的元素 ，指定样式该应用到哪个元素上而已。
### 1.1、三种基本选择器
#### 1、标签选择器
#### 2、类选择器 class
#### 3、ld 选择器
#### 4、优先级id>class>标签
最小原则，id只能作用于一个元素，class是一组，标签是全部
不同优先级的选择器，是覆盖 。
同一优先级，选择器的组合使用示例：
后代选择器：选择所有嵌套在 div 元素内部的 p 元素，并将它们的颜色设置为橘色。
### 1.2层次选择器
#### 1、后代选择器
#### 2、子选择器
#### 3 、向下弟弟
#### 4、通用选择器
### 1.3结构伪类选择器
### 1.4属性选择器（常用）
## 如何学习
## 1．CSS是什么
## 2．CSS怎么用（快速入门）
## 3．CSS选择器（重点＋难点）
## 4．美化网页（文字，阴影，超链接，列表，渐变．．．．）
## 5．盒子模型
## 6．浮动
## 7．定位
## 8．网页动画（特效效果）
