<span>标签 </span>
属性名 ??含义 ????举例
font-family ?设置字体类型 ??font-family:"隶书"
font-size ?设置字体大小 ??font-size：12px;
font-style ?设置字体的风格 ??font-style:italic;
font-weight ?设置字体粗细 ??font-weight：bold;
font ??在一个声明设置所有字体属性 font：italicbold36px"宋体 "
font-style属性
normal ???正常
italic ??倾斜（用的多）
oblique ??斜体
font-weight属性
值 ???说明
normal ??默认值定义标准字体
bold ??粗体字体
bolder ??更粗字体
lighter ??更细字体
100....900 ?定义由粗到细的字体400等同于normal,700等同于bold
font属性
字体属性的顺序：字体风格---字体粗细--字体大小---字体类型
p span{
font:obiqer bold 12px"楷体"
}
文本属性 ?
属性 ?????含义 ??????举例
color ???设置文本颜色 ??color#ooc;
text-align ??设置元素水平对齐方式 ?text-align:right;
text-indent ??设置首行文本缩进 ??text-indent:20px;
line-height ??设置文本行高 ??line-height:25px;
text-ddecoration ?蛇者文本装饰 ??text-decoration:underline;
值 ???说明
left ??把文本排列到左边。默认值：由浏览器决定
right ??把文本排类到右边
center ??把文本排类到中间
justify ??实现两端对齐文本效果
首行缩进
text-indent：em或px
行高
line-height：px
文本装饰
text-decortion属性
值
none ??默认值，定义标准文本
underline ?设置文本下划线
overline ?设置文本上划线
line-through ?设置文本删除线
垂直对齐方式
vertical属性：middle、top、bottom 。
文本阴影
text-shadow：color x-offset y-offset blur-radius
字体属性
字体属性的顺序：字体风格----字体粗细----字体大小---字体类型
伪类名称 ?含义 ???实例
a：link ?未单击访问时超链接样式 ?a:link{color：#9ef5f9;}
a:visited 单击访问后超链接样式 ?a：visited{color：#333；}
a:hover（记住） ?鼠标悬浮上的超链接样式 ?a:hover{color:#ff7300;}
a:active 鼠标单击未释放的超链接样式 a:active{color:#999;}
伪类样式
标签名：伪类名{声明；}
设置伪类的顺序 ：a:link>a:visited>a:hover>a:active
list-style-type
none ?无标记符号
disc ?实心圆
circle ?空心圆 ??list-style-type：none；
square ?实心正方形
decimal ?数字
list-style-image
list-sytle-position
list-style（记住）
背景颜色
background-color
transparent 透明色
背景图像
background-image:url(图片路径)
背景重复方式
background-repeat属性
repeat：沿水平和垂直两个方向平铺
no-repeat：不平铺，即只显示一次
repeat-x:只沿水平方向平铺
repeat-y:只沿垂直方向平铺
背景定位
background-position属性
值 ??含义
xpos ??单位：px，Xpos表示水平位置，Ypos表示垂直位置
X% Y% ??使用百分比表示背景位置
X ?Y方向关键字 ?水平方向关键字：left center right
??垂直方向关键词：top center bottom
背景尺寸 background-size
属性值 ?描述
auto ?默认值，使用背景图片保持原样
percentage 当使用百分值时，不是相对于背景的尺寸大小来计算的而相对元素宽度来计算的
cover ?整个背景图片放大填充了整个元素
contain ?让背景图片保持本身的宽高比例，将背景图片缩放到宽度或者高度正好适合所定义背景的区域
线性渐变
颜色沿着一条直线过渡；从左到右、从右到左、从上到下
语法
liner-gradient{position(渐变方向）color1,color2,...)
经向渐变
圆形或椭圆形渐变，颜色不再沿着一条直线变化，从而从一个起点朝所有方向混合
希望对你有所帮助！！！
CSS美化网页元素
原文地址：http://www.cnblogs.com/javahenku/p/7472089.html