DIV中的背景图片控制有关问题，多谢各位

2013-07-04

DIV中的背景图片控制问题，谢谢各位我这个DIV居中显示，我想让DIV中的背景图片跟DIV一样的宽和高，该如何实现

DIV中的背景图片控制问题，谢谢各位
我这个DIV居中显示，我想让DIV中的背景图片跟DIV一样的宽和高，该如何实现，现在的图片的宽度已经超过了DIV的宽度了，谢谢各位


.middleimg{
margin:0 auto;
width:500px;
height:200px;
border: 1px solid #eee;
background-repeat:no-repeat;
background-image:url(image/login/loginpic.png);
}

<div class="middleimg">

</div>
[解决办法]
图片的宽度已经超过了DIV的宽度,那就设置图片的宽度啊
document.getelementById（"#id"）.style.width
把div的宽度赋值给图片的宽度
[解决办法]


<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<style>
*{
margin:0;
padding:0;
}
#middleimg{
margin:0 auto;
    width:500px;
    height:200px;
    border: 1px solid #eee;
postion:relative;
}
#bg{
width:500px;
height:200px;
position:absolute;
z-index:-1;
}
</style>
</head>
<body>
<div id="middleimg">
<img id="bg" src="image/wallpaper-1542283.jpg" />
哇咔咔咔我是一个登录框！
</div>
</body>
</html>

[解决办法]

引用:

Quote: 引用:

图片的宽度已经超过了DIV的宽度,那就设置图片的宽度啊
document.getelementById（"#id"）.style.width
把div的宽度赋值给图片的宽度

能不能告诉我如何设置图片的宽度，我没有用img标签

背景图应该是设不了宽高的额，设置xy坐标应该也不是你的初衷。
用img+定位结合z-index模拟和div尺寸一样的背景图就行了。
[解决办法]
仅适用与ie，


.middleimg{ 
    margin:0 auto;
    width:500px; 
    height:200px; 
    border: 1px solid #eee;   
    background-repeat:no-repeat;   
 
    filter:progid:dximagetransform.microsoft.alphaimageloader(src='image/login/loginpic.png',sizingmethod='scale')   
  }

如果楼主想其他浏览器也兼容就用两个层吧。

[解决办法]

引用:


<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<style>
*{
margin:0;
padding:0;
}
#middleimg{
margin:0 auto;
    width:500px;
    height:200px;
    border: 1px solid #eee;
postion:relative;
}
#bg{
width:500px;
height:200px;
position:absolute;
z-index:-1;
}
</style>
</head>
<body>
<div id="middleimg">
<img id="bg" src="image/wallpaper-1542283.jpg" />
哇咔咔咔我是一个登录框！
</div>
</body>
</html>

+1，背景的做法可以有很多种的，比如z-index

热点排行

CSS

DIV中的背景图片控制有关问题，多谢各位