3.1 CSS3基础
一、CSS入门基础
1、背景
CSS允许应用纯色作为背景，也允许使用背景图像创建相当复杂的效果
属性 | 描述
--------------------- | ----------------------------
background-attachment | 背景图像是否固定或者随着页面的其余部分滚动
background-color | 设置元素的背景颜色
background-image | 设置图片的背景图片
background-position | 设置背景图片的起始位置
background-repeat | 设置背景图片是否及如何重复
2、文本
CSS文本属性可定义文本外观
通过文本属性，可以改变文本的颜色、字符间距、对齐方式、装饰文本、对文本缩进
| 属性 | 描述 |
|---|---|
| color | 文本颜色 |
| direction | 文本方向 |
| line-height | 行高 |
| letter-spacing | 字符间距 |
| text-align | 对齐元素中的文本 |
| text-decoration | 向文本添加修饰 |
| text-indent | 缩进元素中文本的首行 |
| text-transform | 元素中的字母 |
| unicode-bidi | 设置文本方向 |
| white-space | 元素中空白的处理方式 |
| word-spacing | 字间距 |
CSS3文本效果
-
text-shadow: 向文本添加阴影
-
word-wrap: 规定文本的换行规则
3、字体
CSS字体属性定义文本的字体系列、大小、加粗、风格和变形
| 属性 | 描述 |
|---|---|
| font-family | 设置字体系列 |
| font-size | 设置字体的尺寸 |
| font-style | 设置字体风格 |
| font-variant | 以小型大写字体或正常字体显示文本 |
| font-weight | 设置字体的粗细 |
4、链接
1、CSS链接的四种状态
- a:link 普通的、未被访问的链接
- a:visited 用户已访问的链接
- a:hover 鼠标指针位于链接的上方
- a:active 链接被点击的时刻
2、常见的链接样式：
text-decoration属性大多用于去掉链接中的下划线
5、列表
CSS列表属性允许你放置、改变列表标志，或者将图像作为列表项标志
| 属性 | 描述 |
|---|---|
| list-style | 简写列表项 |
| list-style-image | 列表项图像 |
| list-style-position | 列表标志位置 |
| list-style-type | 列表类型 |
6、表格
1、CSS表格：
CSS表格属性可以帮助我们极大的改善表格的外观
2、表格边框 3、折叠边框 4、表格宽高 5、表格文本对齐 6、表格内边距 7、表格颜色
7、轮廓
1、轮廓主要是用来突出元素的作用
| 属性 | 描述 |
|---|---|
| outline | 设置轮廓属性 |
| outline-color | 设置轮廓的颜色 |
| outline-style | 设置轮廓的样式 |
| outline-width | 设置轮廓的宽度 |