# 1.css font字体样式 #
## 1.1 font-size:大小 ##、
body {
font-size: 16px;
}
注意
* 我们文字大小以后，基本就用px了，其他单位很少使用
* 谷歌浏览器默认的文字大小为16px
* 但是不同浏览器可能默认显示的字号大小不一致，我们尽量给一个明确值大小，不要默认大小。一般给body指定整个页面文字的大小
## 1.2 font-family:字体样式 ##
语法
font-family:Arial, "微软雅黑";
若浏览器不支持Arial 则使用微软雅黑
各种字体之间必须使用英文状态逗号隔开
中文字体需要加英文状态下的引号。字体中包含空格等特殊符号，则必须加英文状态
## 1.3 unicode字体 ##
问题：
- 在css在设置字体名称，直接写中文是可以的，但是在文件编码（GB2312,UTF-8等）不匹配会产生乱码
解决:
- 方案一：你可以使用英文来替代，比如font-family:Arial
- 用unicode字体避免错误 5FAE8F6F96C59ED1 替代 微软雅黑
| 字体名称 | 英文名称 | Unicode 编码 |
| --------- | --------------- | -------------------- |
| 宋体 | SimSun | 5B8B4F53 |
| 新宋体 | NSimSun | 65B05B8B4F53 |
| 黑体 | SimHei | 9ED14F53 |
| 微软雅黑 | Microsoft YaHei | 5FAE8F6F96C59ED1 |
| 楷体_GB2312 | KaiTi_GB2312 | 69774F53_GB2312 |
| 隶书 | LiSu | 96B64E66 |
| 幼园 | YouYuan | 5E7C5706 |
| 华文细黑 | STXihei | 534E65877EC69ED1 |
| 细明体 | MingLiU | 7EC6660E4F53 |
| 新细明体 | PMingLiU | 65B07EC6660E4F53 |
## 1.4 font-weight:字体粗细##
- 在html 可以使用 b 和 strong 实现加粗
- 可以使用css实现，可是没有语义
| 属性值 | 描述 |
| ------- | :-------------------------------------------------------- |
| normal | 默认值（不加粗的） |
| bold | 定义粗体（加粗的） |
| 100~900 | 400 等同于 normal，而 700 等同于 bold 我们重点记住这句话 |
## 1.5 font-style:字体风格 ##
- 在html中如何将字体倾斜我们可以用标签来实现
- 字体倾斜除了用 i 和 em标签
- 可以使用css来实现
| 属性 | 作用 |
| ------ | :------------------------------------------------------ |
| normal | 默认值，浏览器会显示标准的字体样式 font-style: normal; |
| italic | 浏览器会显示斜体的字体样式。 |
## 1.6 font综合写法 ##
严格按照顺序 字号字体一定不能少
font:font-style font-weght font-size/line-height font-family;
font:italic 700 20px "黑体";
# 2.css外观属性
## 2.1 文本颜色 ##
| 表示表示 | 属性值 |
| :------------- | :-------------------------------------- |
| 预定义的颜色值 | red，green，blue，还有我们的御用色 pink |
| 十六进制 | #FF0000，#FF6600，#29D794 |
| RGB代码 | rgb(255,0,0)或rgb(100%,0%,0%) |
## 2.2 text-align文本内容对齐 ##
text-align: center;
| 属性 | 解释 |
| ------ | :--------------: |
| left | 左对齐（默认值） |
| right | 右对齐 |
| center | 居中对齐 |
## 2.3 text-indent 首行缩进 ##
设置首行缩进
单位：数值、em字符宽度、浏览器宽度百分比
## 2.4 line-height 行间距 ##
用于设置行间距
单位：px,em,百分比%
一般比字号大7、8号像素左右就可以了
## 2.5 text-decoration ##
text-decoration 通常我们用于给链接修改装饰效果
| 值 | 描述 |
| ------------ | ----------------------------------------------------- |
| none | 默认。定义标准的文本。 取消下划线（最常用） |
| underline | 定义文本下的一条线。下划线 也是我们链接自带的（常用） |
| overline | 定义文本上的一条线。（不用） |
| line-through | 定义穿过文本下的一条线。（不常用） |
# 3.sublime 快捷 #
1. 生成标签 直接输入标签名 按tab键即可 比如 div 然后tab 键， 就可以生成 <div></div>
2. 如果想要生成多个相同标签 加上 * 就可以了 比如 div*3 就可以快速生成3个div
3. 如果有父子级关系的标签，可以用 > 比如 ul > li就可以了
4. 如果有兄弟关系的标签，用 + 就可以了 比如 div+p
5. 如果生成带有类名或者id名字的， 直接写 .demo 或者 #two tab 键就可以了
6. 如果生成的div 类名是有顺序的， 可以用 自增符号 $