html背景图固定,网页背景图片固定在一个位置不重复代码

css之background-repeat的几种属性  background-repeat: 指背景图片的重复与否以及重复方式, 有no-repeat, repeat, repeat-x, repeat-y四种属性值.

no-repeat: 即无论背景图片的大小, 只显示单个背景图片, 如首页的第一篇文章标题前的”NEW”图标, 代码如上所示;

repeat: 指背景图片横向和纵向重复连续显示;

repeat-x: 指背景图片横向重复连续显示;

repeat-y 指背景图片纵向重复连续显示

如何让网页背景图片固定在一个位置不重复

解决思路：

首先要控制背景图片不重复平铺，然后控制背景的位置用background-position，控制重复的属性是background-repeat。

具体步骤：

代码示例：

body{background-image:url(demo.gif);background-repeat:no-repeat;background-attachment:fixed;background-position:left bottom}

document.write(new Array(100).join("
"))

注意：必须在设置对象背景图片的有关属性前为对象指定背景图片。

技巧：注意到本例所用到的属性都是以background为前缀的，也就是说所有的属性设置都是基于background的，因此可以将本例CSS部分的代码精简如下：

body{background:url(demo.gif) no-repeat center}

象background这种CSS属性叫复合属性，类似的还有font、border、margint和padding等