字体修饰 & 列表符号样式 & 盒模型

字体修饰

1. 字体大小：选择器{font-size:12px/14px/16px;}
   
2. 文本颜色：{color:颜色值;}
3. 文本字体：{font-family:"宋体","黑体";}
   说明：
   当字体是中文字体时需加引号；
   当英文字体中有空格时需加引号如"Times New Roman"；
4. 加粗：{font-weight:bolder/bold/normal/100-900;}
5. 检索或设置对象中的文本的大小写
   text-transform:none/capitalize首字母大写/uppercase将单词全部变成大写/lowercase将单词大写转换成小写
6. 字体风格：{font-style:normal常规字体 /italic /oblique倾斜;}
7. 水平对齐方式{text-align:left/right/center/justify（两端对齐中文不起作用）;}
8. 垂直对齐方式{vertical-align:top/bottom/middle;}
9. 行高{line-height:normal/数值;}
10. 文本修饰：text-decoration:none /underline /overline /line-through /blink
    说明：
    none:没有修饰 underline:添加下划线 overline:添加上划线 line-through:添加删除线 blink：闪烁 (不支持IE、谷歌、苹果)
11. 首行缩进：{text-indent:value;} 单位最好写em
    说明：text-indent可以取负值； text-indent属性只对第一行起作用。
12. 字间距{letter-spacing:value;}控制英文字母或汉字的字距。
13. 词间距{word-spacing:value;}控制英文单词词距。

定义列表符号样式

1. list-style-type:disc(实心圆)/circle（空心圆）/square(实心方块) /none(去掉列表符号)；
2. 使用图片作为列表符号：list-style-image:url(所使用图片的路径及全称);
3. 定义列表符号位置：list-style-position:outside /inside;
   关于列表属性的简写：list-style: ;

盒模型的概念

1. 盒模型是css布局的基石，规定了网页元素如何显示以及元素间相互关系。css定义所有的元素都可以拥有像盒子一样的外形和平面空间。
2. 盒模型的组成：边框、外边距margin、内填充padding、内容区content
3. 盒模型是有两种标准的，一个是标准模型，一个是IE模型。
4. 设置两种模型

/* 标准模型 */
box-sizing:content-box;

 /*IE模型*/
box-sizing:border-box;

5. css盒模型和IE盒模型的区别：
   (1) 在标准盒子模型中，width 和 height 指的是内容区域的宽度和高度。增加内边距、边框和外边距不会影响内容区域的尺寸，但是会增加元素框的总尺寸
   元素总宽度 = content + 左右padding + 左右border + 左右margin
   
   (2) IE盒子模型中，width 和 height 指的是内容区域 +border +padding的宽度和高度。
   元素总宽度 = width + 左右margin