06CSS背景和列表

[目录]

目录

• [目录]
  • 一、CSS背景
  • 二、CSS列表样式

一、CSS背景

1. 背景颜色：设置元素的背景颜色
   background-color:颜色/transparent
   • transparent是全透明黑色的速记法
   • 颜色值/颜色名/RGB/六进制
   • 背景区包括：内容、内边距和边框、不包含外边距
2. 背景图片：设置元素的背景图片
   backgroun-image:URL|none
   • url地址可以是相对于地址也可以是绝对地址
   • 元素的背景占据了元素的全部尺寸，包括内边距和边框，但不包括外边距
   • 默认的，背景图像位于元素的左上角，并在水平和垂直方向上重复
3. 背景图片重复：设置元素的背景图片的重复方式
   background-repeat:repeat重复/no-repeat不重复/repeat-x水平重复/repeat-y垂直重复
4. 背景图片显示方式：设置元素的背景图片的显示方式
   background-attachment:scroll/fixed
   • scroll:默认值，背景图片随滚动条滚动
   • fixed:当页面的其余部分滚动时，背景图片不会移动
5. 背景图片定位：设置元素的背景图片的起始位置
   background-position:百分比/值/top/right/bottom/left/center
6. 背景缩写
   background:background-color、background-image、background-repeat、background-attachment、background-position
   • 各值之间用空格分割，不分先后顺序

二、CSS列表样式

1. 列表项标记：设置列表项的标记样式
   类型：list-style-type:关键字/none
2. 列表项位置：设置列表项标记的位置
   list-style-type:关键字/none
   • inside：列表项目标记放置在文本以内，且环绕文本根据标记对齐
   • outside：默认值，列表项目标记放置在文本以外，且环绕文本不根据标记对齐
3. 列表样式缩写
   list-style:list-style-type、list-style-position、list-style-image
   • 值之间用空格分隔开
   • 顺序不固定
   • list-style-image会覆盖list-style-type的设置