CSS学习笔记（六）背景和列表

1、背景样式

（1）背景颜色
background-color：color|transparent
color：指定背景颜色。如：yellow|#00ff00|rgb(255,0,255)；
transparent：指定背景颜色应该是透明的。这是默认；
*注：背景区包括内容、内边距和边距，不包含外边距。
（2）背景图片
background-image:URL|none
url(‘URL’)：图像的URL，相对地址或绝对地址；
none：无图像背景会显示。这是默认
*注：默认背景图像位于元素左上角，并在水平和垂直方向上重复；背景不包括外边距。

同时设置背景图片和背景颜色，背景图片会覆盖背景颜色。

background-repeat
repeat：背景图像将向垂直和水平方向重复。这是默认
repeat-x：只有水平位置会重复背景图像
repeat-y：只有垂直位置会重复背景图像
no-repeat：background-image不会重复

background-attachment：scroll|fixed
scroll：默认值，背景图片随滚动条滚动；
fiexed：背景图片固定。

设置元素的背景图片的起始位置
background-position：百分比|值|top|right|bottom|left|center

（3）背景缩写
background：[background-color] [background-image] [background-repeat] [background-attachent][background-position]
各值之间用空格分隔，不分先后顺序。

2、列表样式

（1）设置列表项的标记样式类型
list-style-type：关键字|none

ul li{list-style-type:circle;}

<ul>
	<li>电脑</li>
	<li>手机</li>
	<li>平板</li>
</ul>

（2）使用图片设置列表项的标记
list-style-image：URL|none

ul li{list-style-image:url(img/logo.png);}

（3）设置列表项标记的位置
list-style-position：inside|outside
inside：列表项目标记放置在文本以内，且环绕文本根据标记对齐。
outside：默认值。保持标记位于文本的左侧。列表项目标记放置在文本以外，且环绕文本不根据标记对齐。

（4）列表样式缩写
list-style：list-style-type list-style-position list-style-image
*注：list-style-image会覆盖list-style-type