1.颜色属性
| color属性定义文本的颜色 |
| color:red |
| color:#ff6600 可简写为 color:#f60 |
| color:rgb(255,255,255) |
| color:rgba(255,255,255,0.5) 增加透明度 |
2.字体属性
| font-size字体大小 |
| px：设置一个固定的值 |
| % ：父元素百分比 |
| smaller：比父元素更小 |
| larger：比父元素更大 |
| inherit：继承父元素大小 |
| font-family字体种类 |
| 用法：font-family：'宋体',serif; |
| 可以用","隔开，以确保当字体不存在的时候自己使用下一个 |
| 可以用字体的英文来代替中文，如Microsoft YaHei代替'微软雅黑' |
| font-weight字体加粗 |
| 用法：font-weight:300; 或 font-weight:bold; |
| normal(默认值 400=normal) |
| bold(加粗 700=bold) |
| bolder(更粗) |
| lighter(更细) |
| font-style字体样式 |
| 用法：font-style:italic; 设置为斜体 |
| 正常(标准) normal |
| 斜体 italic |
| 倾斜 oblique |
| 继承 inherit |
| font-variant小型大写字母显示文本 |
| font-variant 属性设置小型大写字母的字体显示文本，这意味着所有的小写字母均会被转换为大写，但是所有使用小型大写字体的字母与其余文本相比，其字体尺寸更小。 |
| 用法：font-variant:small-caps; 设置小型大写字母显示文本 |
| 正常(标准) normal |
| 小型大写字母显示文本 small-caps |
| 继承 inherit |
3.背景属性
| 背景颜色background-color |
| 用法与color属性类似：background-color:rgb(12,34,56); |
| 背景图片background-image |
| background-image:url(图片路径); |
| background-image:none; |
| 继承 inherit |
| 背景重复background-repeat |
| 用法：background-repeat:repeat-x; 向X轴重复 |
| 重复平铺满(默认) repeat |
| 向X轴重复 repeat-x |
| 向Y轴重复 repeat-y |
| 不重复 no-repeat |
| 背景位置background-position |
用法：background-position:left,center; 背景横向居左，上下居中。
background-position:(x),(y); |
| 横向（left,center,right） |
| 纵向（top,center,bottom） |
| 用数值来表示位置：background-position:20px,20px; |
| 简写方式 background |
| 用法：background:背景颜色 url(图像) 重复 位置 |
| background:red url(image/bg.jpg) no-repeat top center; |
4.文本属性
| 横向排列: text-align:left(center/right); |
| 文本行高: line-height: 20px(100%);(1.%基于字体大小的百分比行高 2.数值为设置固定值) |
| 首行缩进: text-indent:20px;(1.%基于父元素的百分比缩进 2.数值为设置固定值 3.inherit继承) |
| 字符间距: letter-spacing: 10px;(normal、inherit、可设置为负值) |
| 单词间距: word-spacing:20px;(normal、固定值、inherit) |
| 文本方向: direction:ltr;(默认从左到右，left to right --> ltr)，可更改为rtl或者继承父元素,（与其他文本属性冲突） |
| 文本大小写: text-transform:none;（默认） |
| 每个单词以大写字母开头: text-transform:capitalize; |
| 定义仅有大写字母: text-transform:uppercase; |
| 定义无大写字母，仅有小写字母: text-transform:lowercase; |
| 从父元素继承: text-transform:inherit; |
5.边框属性
| 边框风格 border-style |
| 定义虚线边框示例：border-style:dashed; |
| 单独定义某一方向的边框样式 |
| border-top-style 上边框样式 |
| border-bottom-style 下边框样式 |
| border-left-style 左边框样式 |
| border-right-style 右边框样式 |
| 边框风格样式的属性值 |
| 1.none 无边框 |
| 2.solid 直线边框 |
| 3.dashed 虚线边框 |
| 4.dotted 点状边框 |
| 5.double 双线边框 |
| 6.groove 凸槽边框（依托border-color的属性值） |
| 7.ridge 垄状边框（依托border-color的属性值） |
| 8.inset inset边框（依托border-color的属性值） |
| 9.outset outset边框（依托border-color的属性值） |
| 10.inherit 继承 |
| 边框宽度 |
| border-width: 10px |
| 单独风格 |
| border-top-width 上边框宽度 |
| border-bottom-width 下边框宽度 |
| border-left-width 左边框宽度 |
| border-right-width 右边框宽度 |
| 宽度属性值 |
| thin 细边框 |
| medium 中等边框 |
| thick 粗边框 |
| px 固定值的边框 |
| inherit 继承 |
| 边框颜色 |
| border-color: red |
| 单独风格 |
| border-top-color 上边框颜色 |
| border-bottom-color下边框颜色 |
| border-left-color 左边框颜色 |
| border-right-color 右边框颜色 |
| 颜色属性值（与color属性类似） |
| red、green |
| rgb(255,255,0) |
| rgba(255,255,0,0.5) |
| #ff0、#ffff00 |
| 颜色属性值的四种情况 |
| 一个值：border-color: (上、下、左、右) |
| 两个值：border-color: (上、下）、（左、右) |
| 三个值：border-color: (上）、（左、右）、（下） |
| 四个值：border-color: (上）、（下）、（左）、（右）) |
| 简写方式 border |
| 用法：border: 边框风格 边框宽度 边框颜色 |
| 示例：border: solid 2px #f60 |
6.列表属性
无序列表:<ul><li></li></ul>
有序列表:<ol><li></li></ol>
| 标记的类型 list-style-type |
| none 无标记 |
| disc 默认，标记是实心圆 |
| circle 标记是空心圆 |
| square 标记是实心方块 |
| decimal 标记是数字 |
| decimal-leading-zero 0开头的数字标记(01,02,03等) |
| lower-roman 小写罗马数字（i,ii,iii,iv,v等） |
| upper-roman 大写罗马数字（I,II,III,IV,V等） |
| lower-alpha 小写英文字母 |
| upper-alpha 大小英文字母 |
| lower-greek 小写希腊字母(alpha,beta,gamma等) |
| lower-latin 小写拉丁字母 |
| upper-latin 大写拉丁字母 |
| ... |
| 标记的位置 list-style-position |
| inside 列表项目标记放置在文本内，且环绕文本根据标记对齐。 |
| outside 默认值，保持标记位于文本的左侧，列表项目标记放置在文本意外，且环绕文本不根据标记对齐。 |
| inherit 从父元素继承 |
| 设置图像列表标记 list-style-image |
| url 图像的路径 |
| none 默认，无图形显示 |
| inherit 继承父元素 |
| 简写方式 list-style |
| 用法：list-style: 标记风格 标记的位置 标记图片的url; (当图片路径无效时，标记风格的样式) |
| 示例：list-style: circle inside url(图片路径); |