CSS背景:background

2016-02-19 16:38 6 1 收藏

有一种朋友不在生活里,却在生命力;有一种陪伴不在身边,却在心间。图老师即在大家的生活中又在身边。这么贴心的服务你感受到了吗?话不多说下面就和大家分享CSS背景:background吧。

【 tulaoshi.com - Web开发 】

语法:

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

background : background-color || background-image || background-repeat || background-attachment || background-position

取值:

该属性是复合属性。请参阅各参数对应的属性。

默认值为:transparent none repeat scroll 0% 0%。

说明:

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

设置对象的背景样式。

如使用该复合属性定义其单个参数,则其他参数的默认值将无条件覆盖各自对应的单个属性设置。

例如:设置 background : white 等于设置 background : white none repeat scroll 0% 0% 。如果在此之前设置了 background-image 属性,则其设置将被 background-image 的默认值 none 覆盖。

背景样式属性的作用区域为对象的内容区域与内补丁( padding )区域。不包括边框( border )与外补丁( margin )区域。尽管该属性不可继承,但如果未指定,其父对象的背景颜色和背景图将在对象下面显示。

对应的脚本特性为 background 。

示例:

div { background: red no-repeat scroll 5% 60%; }
body { background: url("images/aardvark.gif") repeat-y; }
pre { background: url("images/aardvark.gif") top; }
caption { background: fuchsia; }

来源:http://www.tulaoshi.com/n/20160219/1612635.html

延伸阅读
标签: Web开发
背景图片Background Images有许多属性可以操作。 幸运的是,可以使用background处理所有: body {     background: white url(/jc/UploadFiles/200803/20080309225852658.gif) no-repeat top right; } 上面合并了下面属性: background-color出现在前面。  back...
标签: Web开发
  原文:http://www.planabc.net/2008/04/14/background-clip_background-origin/ background-clip 和 background-origin 是 CSS3 中新加的 background module属性,用来确定背景的定位。 background-clip 用来判断 background 是否包含 border 区域。而 background-origin 用来决定 background-position 计算的参考位置。 语法为: ...
标签: Web开发
css2.0 中的 background-position 大家用到过吗?怎么用的?用在哪里?js控制图片切换有两个缺陷:1.有时后切换缓慢,需要预载解决;2.要制作2-3套图片 看看怎么用 background-position 解决这个问题,实现快速"切换",这里只用到一张图片 至于代码中的font:10px/1也是不常见的用法 可以参考这里:http://www.w3.org/Sty...
标签: Web开发
background-position的说明:     设置或检索对象的背景图像位置。必须先指定 background-image 属性。该属性定位不受对象的补丁属性( padding )设置影响。     默认值为: 0% 0% 。此时背景图片将被定位于对象不包括补丁( padding )的内容区域的左...
标签: Web开发
change(fn) 在每一个匹配元素的change事件中绑定一个处理函数。 change事件会在元素失去焦点的时候触发,也会当其值在获得焦点后改变时触发。 !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" html xmlns="http://www.w3.org/1999/xhtml" head meta http-equi...

经验教程

655

收藏

69
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部