目录
CSS背景
1、背景颜色
background-color:颜色 | transparent
transparent是全透明黑色的速记法,类似rgba(0,0,0,0)这样的值。 透明色
背景区包括内容、内边距padding和边框,不包含外边距(margin)。
2、背景图片
background-image:URL | none
url地址可以是绝对地址也可以是相对地址
元素的背景占据了元素的全部尺寸,但不包括外边距
默认背景图像位于元素的左上角,并在水平和垂直方向上重复
同时设置背景颜色和背景图片时,背景图片会覆盖背景颜色。一般同时设置,当背景图片出问题的时候,可显示背景颜色。
3、背景图片重复
background-repeat:repeat | no-repeat | repeat-x | repeat-y,该属性必须在有背景图片的情况下才有效。
4、背景图片显示方式
background-attachment:scroll | fixed
scroll:默认值,背景图片随滚动条滚动
fixed:当页面的其余部分滚动时,背景图片不会移动,固定地显示在某个位置上,这时背景图片的位置是相对于整个页面来说的,不以容器为位置参考,比如position属性为top时,会在整个页面的居中顶部显示。
5、背景图片定位
设置元素的背景图片地起始位置
background-position:百分比 | 值 | top | right | bottom | left | center
背景缩写
各值之间用空格分割,不分先后顺序,值可以有一个可以有多个
CSS列表
1、列表项标记
设置列表项的标记样式类型
list-style-type:关键字 | none
值 | 说明 |
none | 无标记 |
disc | 实心圆点 |
circle | 空心圆点 |
square | 实心方块 |
值 | 说明 |
none | 无标记 |
decimal | 从1开始的整数 |
lower-roman | 小写罗马数字 |
upper-roman | 大写罗马数字 |
lower-alpha | 小写英文字母 |
upper-alpha | 大写英文字母 |
使用图片设置列表项的标记
list-style-image:URL | none
2、列表项标记位置
list-style-position:inside | outside
inside:列表项目标记放置在文本以内,且环绕文本根据标记对齐
outside:默认值,列表项目标记放置在文本以外,且环绕文本不根据标记对齐
3、列表样式缩写
list-style:list-style-type list-style-image list-style-position
值之间用空格隔开,顺序不固定,list-stye-image会覆盖list-style-type的设置