美文网首页
#CSS-background-3

#CSS-background-3

作者: 张盛泽 | 来源:发表于2017-07-07 16:39 被阅读0次

    CSS-background

    <pre>
    CSS-background系列属性总结,由此写记下来,对大家分享,供新人学习,老人查阅,让初学者有所收获。
    ------Danlv
    </pre>

    背景颜色

    颜色

    1.rgb(0-255,0-255,0-255)
    <small> 常见颜色:
    background-color:rgb(0,255,0)绿色
    background-color:rgb(0,0,255)蓝色
    background-color:rgb(0,0,0)黑色
    background-color:rgb(255,255,255)白色
    </small>
    2.十六进制

    <small>
    常见颜色
    #000 黑
    #fff 白
    #f00 红
    #333 灰
    #222 深灰
    #ccc 浅灰
    </small>

    3.八进制
    在实际的项目开发中,应该尽可能的使用十六进制

    背景图片

    background-image:url(图片地址),如果图像过小的话会被平铺

    background-repeat背景图像是否重复

    1.background-repeat:no-repeat 不平铺
    2.background-repeat:repeat-x 横向平铺
    3.background-repeat:repeat-y 纵向平铺

    background-position 背景定位

    1.background-position:向右移动值 px 向下移动值px
    * 支持值为负数
    * 雪碧图


    为什么要使用雪碧图 ,页面中一张图片,浏览器一次请求。
    能够减少页面的http请求,提高速度。
    雪碧图示例

    雪碧图

    2.background-position:描述左右的词 描述上下的词
    * 左右 left/center/right
    * 上下 top/center/bottom
    *大背景图居中/通栏banner演 background-position:center top;

    background-attachment 背景图像是否固定

    背景图固定 &nbsp background-attachment:fixed 。
    设置这个属性,背景不会随着网页进行滚动。

    相关文章

      网友评论

          本文标题:#CSS-background-3

          本文链接:https://www.haomeiwen.com/subject/xrcrhxtx.html