12.background系列属性

  1. background-color
    .box1{
      background-color: green;
     }
    .box2{
      background-color: rgb(0,255,0);
     }
    .box3{
      background-color: #00ff00;//16进制表示法,aabbcc形式的可简写为abc
    }
  2. background-image:url()
    //图片会重复来铺满背景,如果图片过大,会部分展示图片
    url(../images/jj.jpg)
    url(http://jier.com)
  3. background-repeat:设置背景图是否重复即重复方式
    .box{
     background-image:url(../images/jj.jpg);
     background-repeat:no-repeat;//repeat-x,repeat-y
    }
    
  4. background-position
    .box{
     background-image:url(../images/jj.jpg);
     background-repeat:no-repeat;
     background-position:10px 10px;//向右偏移量,向下偏移量。值可以为负数表示左移上移,即浏览器遮住,还可用right,center,top,bottom,left等
     background-position:center top;//左右居中,上面置顶
    }
  5. background-attachment//背景是否固定
    background-attachment:fixed;//页面滚动,背景图片不动
  6. background综合属性

    background:red url(../img/jj.jpg) no-repeat 10px 10px fixed;
    //顺序不固定,某些可以不写,但两个数值必须连写
    
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值