<!DOCTYPE html>
<html lang="en">
<head>
<meta charset='UTF-8'>
<title>背景详解</title>
<style>
#div1 {
border:1px solid green;
width:600px;
height:500px;
background-image:url(./girl.JPG);
}
body {
/*background-color:green;
background-image:url(./girl.JPG);
background-repeat:no-repeat;//设置背景图片是否平铺
background-position:right top;//设置背景图片的位置
background-attachment:fixed;//背景图片相对窗口固定 默认跟随元素*/
background:red url(./girl.JPG) no-repeat right top fixed;//简写
}
</style>
</head>
<body>
<div id='div1'>
This is a test msg!
</div>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</body>
</html>
运行截图:
