在CSS中,首先需要理解background-attachment的意思是定义背景图片随滚动轴的移动方式,取值方式有:scroll | fixed | inherit,scroll: 随着页面的滚动轴背景图片将移动,fixed: 随着页面的滚动轴背景图片不会移动,inherit: 继承,具体的用法通过代码来理解:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "
http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS background-attachment 属性示例</title>
<style type="text/css" media="all">
body
{
background-image:url('/images/list-orange.png'); //图片的地址你可以去自行添加,这里只是假设的一种图片
background-attachment:fixed;
background-repeat:repeat-x;
background-position:center center;
position:absolute;
height:5000px;
}
</style>
</head>
<body>
<p>拖动滚动条,并且注意中间有一条橙色线并不会随滚动条的下移而上移.</p>