日期:2014-05-17  浏览次数:21086 次

使用CSS设置背景图片,图片比较大,怎么完全显示在一个DIV中?
意思是图片是500*500的,而DIV是100*100,那如何设置为背景图片,并且显示图片的全部内容呢?

我在JS中是这样写的:

b.style.backgroundImage="url('1.jpg')";
b.style.width="100px";
b.style.height="100px";

图片能显示,但是没有显示完全,说明上面设置的高度与宽度没有效果

这个要如何写呢?

------解决方案--------------------
b.style.backgroundRepeat="repeat";
------解决方案--------------------
这个要用到图片拉伸了。。。

参考:
HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>?</title>
<style type="text/css">
.divBox { 
    width:100px; height:100px; border:solid 1px red;
    
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='flashbutton.gif' ,sizingMethod= 'scale' );
    background-repeat: no-repeat; 
    background-positon: 100%, 100%; 
}
</style>

</head>
 
<body>
<div class="divBox">test...</div>
</body>
</html>

------解决方案--------------------
你先用格式工厂将图片转换成100*100的,然后再写到div中不就好了
------解决方案--------------------
探讨
这个要用到图片拉伸了。。。

参考:

HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtm……