• 微信号
目录

html笔记

您当前的位置:首页 > 我的笔记 > html笔记>css背景样式

css背景样式

css背景

background 简写属性:在一个声明中设置所有的背景属性

语法

  • background: color image repeat attachment position
div {background: #fff url(../images/pic.jpg) no-repeat scroll fixed;}

background-color : 设置对象的背景颜色

属性值

  • transparent :默认值(背景色透明
  • {color} :指定颜色
div{background-color: transparent;}
div{background-color: #ffffff;}

background-image : 设置对象的背景图像

属性值

  • none :默认值(无背景图)
  • url({url}) :使用绝对或相对 url 地址指定背景图像
div{background-image: none;}
div{background-image: url(../images/piv.jpg);}

background-repeat : 设置对象的背景图像铺排方式

属性值

  • repeat :默认值(背景图像在纵向和横向平铺)
  • no-repeat :背景图像不平铺
  • repeat-x :背景图像仅在横向平铺
  • repeat-y :背景图像仅在纵向平铺
div{
    background-image: url(../images/piv.jpg);
    background-repeat: no-repeat;
}

ackground-position : 设置对象的背景图像位置

属性值

{x-number | top | center | bottom } {y-number | left | center | right } :控制背景图片在元素的位置:x轴 、y轴。其铺排方式为no-repeat

div{
    background-image: url(../images/piv.jpg);
    background-position: left;
}

background-attachment : 设置对象的背景图像滚动位置

属性值

  • scroll :默认值。背景图像会随着页面其余部分的滚动而移动
  • fixed : 当页面的其余部分滚动时,背景图像不会移动
div{
    background-image: url(../images/piv.jpg);
    background-attachment: scroll;
}