#CSS-background-3

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 。
设置这个属性,背景不会随着网页进行滚动。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1. 定义和用法 background是一个简写属性,可以在一个声明中设置所有的背景属性,可设置的属性如下: 这些...
    lightNate阅读 4,428评论 2 9
  • CSS边框属性 元素的边框就是围绕元素内容和内边距的一条或多条线。 元素的边框属性: border 简写属性,用...
    Zd_silent阅读 1,007评论 0 1
  • Div和Span标签 什么是div? 作用: 一般用于配合css完成网页的基本布局 什么是span? 作用: 一般...
    Jackson_yee_阅读 863评论 1 1
  • 这本书没有大起大落的情节,也毫不烧脑,但是最后却有让人想要落泪的冲动。 本来他只是想要徒步去看望患了癌症的老友,在...
    还是那个阿堇阅读 212评论 0 0
  • 人生越动荡,越需要野蛮生长 -斜杠少年老白- 每年夏天,我的人生都很动荡。 每次人生动荡,都让我野蛮生长。 去年夏...
    斜杠少年老白阅读 1,654评论 7 30