在css样式里设置背景图片拉伸充满有几种方法：
1、用body里设置（但是这样的缺点是只能横向充满，高度是按比例拉伸的）:
background-size:100%;
或者：background-size:cover;
示例代码：
body{
background-image:url(test.jpg);
background-repeat:no-repeat;
background-size:100%;
}2、用一个div充满整个body（这样的缺点可想而知，网页的代码只能放在这个div里）：
示例代码：
html部分代码：
<body>
<div class="background">
<h1>测试测试</h1>
</div>
</body>css样式部分代码:
body{
overflow:hidden;
}
div.background{
position:absolute;
width:100%;
height:100%;
background-image:url(timg.jpg);
background-repeat:no-repeat;
background-size:100% 100%;
}
3、用一个img充满整个body（但是这样子后面的元素都要设置定位了，但自我感觉并不碍事哈~~~）：
html部分代码：
<body>
<img class="background" src="timg.jpg" />
<h1>测试测试</h1>
</body>css样式部分代码：
body{
overflow:hidden;
}
img.background{
position:absolute;
width:100%;
height:100%;
}
h1{
position:absolute;
top:0px;
}上面都是我的一些总结，不足之处欢迎补充！
扫一扫
1041
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
