[TOC]
# 案例1:CSS样式表语法
![](https://img.kancloud.cn/99/84/99847ee0d790d9a9df02acdc17a227ff_661x147.png)
![](https://img.kancloud.cn/cf/3e/cf3eb321e5f250f2b85fc7185da15158_304x159.png)
# 案例2:三种样式表
![](https://img.kancloud.cn/9a/1f/9a1f84e14c3c98d5cfb76eb6c293c41f_878x409.png)
## 扩展
![](https://img.kancloud.cn/26/ca/26ca4d12dce8f35bcc8cdf56b14e287e_376x153.png)
## 样式表优缺点
![](https://img.kancloud.cn/ca/9a/ca9a6ecbf4acc6b4b703f9cc6c87e1f1_1071x202.png)
> 样式表的优先级???
# 案例3: 试一试
> 1. 外部样式颜色为红色
> 2. 内部样式颜色为蓝色
> 3. 行内样式样色为黄色
> 注意:请将三种样式的选择器都设置为div,看看颜色变化。
# 案例4:看看输出
## CSS的两个特性
1. 层叠(叠加多次样式)
2. 继承(从父元素继承样式)
![](https://img.kancloud.cn/bd/b0/bdb0452e8c07f8aefaade93a83885a53_563x500.png)
- 目录
- 1课程介绍
- 2HTML
- 2.1概述
- 2.2常用标签
- 2.3列表标记
- 2.4超链接与图
- 2.5表格
- 2.6表单
- 2.7frameset
- 3CSS
- 3.1样式表
- 3.2选择器
- 3.3样式
- 3.4浮动和定位
- 3.5布局案例
- 3.6CSS3
- 3.7选修
- 4JavaScript
- 4.1JavaScript基础
- 4.2JavaScript变量及函数
- 4.3JavaScript常见对象及操作
- 4.4JavaScript操作DOM&BOM
- 4.5JavaScript事件响应
- 5Ajax
- 5.1Ajax基础
- 5.2Ajax&XML
- 5.3Ajax&JSON
- 6HTML5
- 6.1新标签及媒体
- 6.2Canvas绘图
- 7jQuery
- 7.1jQuery&DOM
- 7.2jQuery&Ajax
- 7.3jQuery动画