css背景样式

652 阅读1分钟

1.背景样式


    background-color           //设置背景颜色       
    background-image           //图片设置为背景
    background-position        //设置背景图像的起始位置
    background-attachment      //背景图像是否固定或者随着页面其余部分滚动
    background-repeat          //设置背景图像是否重复以及如何重复
    background                 //简写属性,作用将背景属性设置在一个声明中
 

background-image: URL|none

  • 设置元素的背景图片
  • url可以是绝对路径,也可以是相对路径
  • 元素背景占据元素全部尺寸,包括内边距和边框,但不包括外边距
  • 默认的背景图像位于元素左上角,并在水平和垂直方向重复
  • 背景图片会覆盖背景颜色

background-repeat: 背景图片重复

  • repeat:重复
  • no-repeat:不重复
  • repeat-x:水平方向重复
  • repeat-y:垂直方向重复

background-attachment 背景图片显示方向

  • scroll:随着滚动条滚动
  • fixed:固定

background-position:图片定位

  • (x,y)第一个水平,第二个垂直左上角是(0,0)只写一个的话,另一个垂直
  • (x%,y%)
  • top: 顶部显示,相当于垂直方向0
  • right: 右边显示
  • left、bottom
  • center:居中显示,水平,垂直是居中的

background

color -> image -> repeat -> attchment -> pisiton 不分先后顺序

2.列表样式

    list-style-type             //设置列表项标志的类型
    list-style-image            //设置图像为列表项的标志
    list-style-position         //设置列表中列表项的位置
    list-style                  // 简写属性作用将列表属性设置在一个声明中

list-style-type

  • none
  • disc 实心的圆点
  • circle 空心的圆点
  • squre 实心的方块

list-style: 缩写