网页制作，背景图片

页制作中，如何才能让背景图片不是平铺着的，而是一整张的拉伸，且文字滚动的时候，背景图片是固定的不动？ 

你应该用# 6.3 CSS background-repeat 属性
# 6.4 CSS background-position 属性
# 6.5 CSS background-attachment 属性
这些属性来控制。

background-repeat -- 定义背景图片的重复方式

* 取值: repeat | repeat-x | repeat-y | no-repeat | inherit
o repeat: 平铺整个页面,左右与上下
o repeat-x: 在x轴上平铺,左右
o repeat-y: 在y轴上平铺,上下
o no-repeat: 图片不重复
o inherit: 继承
* 默认值: repeat
* 继承性: 否
* 可使用性: 所有元素
* background:背景.repeat:重复.
* 引用网址:http://www.dreamdu.com/css/property_background_repeat/

示例

body
{
background-image:url('list-orange.png');
background-repeat:no-repeat;
}
div
{
background-image:url('list-orange.png');
background-repeat:repeat-y;
background-position:right;
}

屏幕左上角显示一个橙色点,div的右侧显示一系列橙色点.

css background-repeat 属性示例
延伸阅读

* CSS教程中的属性取值正则表达式介绍(一)

参考

* CSS2.1 'background-repeat'
* CSS3 The 'background-repeat' property



6.5. CSS background-attachment 属性
background-attachment属性是CSS2.1提出的.IE6,Firefox1.5,Opera9支持此属性IE6只有body元素支持fixed属性值
background-attachment -- 定义背景图片随滚动轴的移动方式

* 取值: scroll | fixed | inherit
o scroll: 随着页面的滚动轴背景图片将移动
o fixed: 随着页面的滚动轴背景图片不会移动
o inhert: 继承
* 默认值: scroll
* 继承性: 否
* 可使用性: 所有元素
* background:背景.attachment:附着.
* 引用网址:http://www.dreamdu.com/css/property_background_attachment/

示例

body
{
background-image:url('list-orange.png');
background-attachment:fixed;
background-repeat:repeat-x;
background-position:center center;
}

屏幕的背景图片为一条橙色线.随着滚动轴移动,橙色线的视觉位置不变.

css background-attachment 属性示例
延伸阅读

* CSS教程中的属性取值正则表达式介绍(一)

参考

* CSS2.1 'background-attachment'
* CSS3 The 'background-attachment' property