1.css背景
1）背景色
有外延的文字背景色：
p{background-color:blue;padding:10px;}
p{background-color:#0000ff}
p{background-color:rgb{0,0,255}
background-color不能继承，默认值transparent，意思是透明。
2）背景图片
可以给body、段落等设置背景图片
body{background-image:url(i/test.gif);}本地路径？
p.test{background-image:url(j/test.gif)}
<p class=“test”>这个段落的背景图片是test中定义的颜色<p>
3）背景图片重复
可以在水平、垂直对背景图片进行重复。
水平：repeat-x
垂直：repeat-y
不平铺：no-repeat
body{
background-image:url(i/test.gif);
background-repeat:repeat-x;
}
不写重复的会默认水平垂直都平铺
4)背景图片定位
使用关键词top,left,right,bottom,center,关键词可以成对出现，也可以只出现一个，另外一个默认是center
body{
background-image:url(i/test.gif);
background-position:center right;
}
使用百分数值定位，第一个代表垂直方向，第二个代表水平方向，如果只出现一个，这个值代表水平值。
body{
background-image:url(i/test.gif);
background-position:10% 90%;
}
使用像素值定位，第一个代表距离上方的距离，第二个代表距离左边的距离。
body{
background-image:url(i/test.gif);
background-position:10px 80px;
}
5）背景图片固定
可以时背景图片不随着页面滚动
body{
background-image:url(i/test.gif);
background-position:center right;
background-attachment:fixed
}
2.css文本
1)文本缩进
不能应用到行内元素。
p{text-indent:2em;}
可以使用负值，但是为了前面的文字避免超出浏览器，可以使用padding
p{text-indent:4em;padding-left:5em;}
2)水平对齐方式
它会影响一个元素中的文本行互相之间的对齐方式
左对齐：
p{text-align:left;}
右对齐：
p{text-align:right;}
居中对齐：
p{text-align:center;}
3)字间隔
增加单词间距：
p{word-spacing:10px;}
减少单词间距：
p{word-spacing:-0.2px;}
4)字母间距
增加单词间距：
p{letter-spacing:10px;}
减少单词间距：
p{letter-spacing:-0.2px;}
5）处理文本大小写
默认不做任何改动
小写变为大写：
h1 {text-transform: uppercase}
大写变为小写：
h1 {text-transform: lowercase}
首字母变大写：
h1 {text-transform:capitalize}
6）文本装饰
不装饰、关闭文本装饰：
a {text-decoration: none;}
文本下划线装饰：
a {text-decoration: underline;}
文本上划线装饰：
a {text-decoration: overline;}
文本中间贯穿线：
a {text-decoration: line-through;}
本文闪烁：
a {text-decoration: blink;} 但是这个我试了没有生效
3）css字体
字体：font-family 包括通用字体系列和指定字体系列
大小：font-size
h1 {font-size:60px;}
或者
h1 {font-size:1.5em;}浏览器中默认的文本大小是 16 像素。因此 1em 的默认尺寸是 16 像素。
样式：font-style:normal、italic、oblique
粗细：font-weight：blod、100~900
4)链接：
a:link {text-decoration:none;} /* 未被访问的链接 /
a:visited {text-decoration:none;color:gray} / 已被访问的链接 /
a:hover {text-decoration:underline;color:blue} / 鼠标指针移动到链接上 /
a:active {text-decoration:underline;} / 正在被点击的链接 */
active必须位于hover之后
hover必须位于link和visited之后
5)列表
<style type="text/css">
ul.circle {list-style-type: circle}
ul.square {list-style-type: square}
ul.none {list-style-type: none}
ul.disc{list-style-type:disc}
</style>
<ul class="disc">
<li>水</li>
<li>咖啡</li>
</ul>
图片作为列表项图标：
ul
{
list-style-image: url('/i/eg_arrow.gif')
}
链接：http://www.w3school.com.cn/css/css_background.asp
