css 图片自动缩放问题

发布网友发布时间：2022-04-24 12:14

共5个回答

热心网友时间：2022-04-21 10:21

“这个背景图我用的是整张圆角图片，省的做圆角时用好几张图片结合了”

LZ你这个想法很有创意，但是我跟你说实现不了或者要实现要走很多路。

第一：你如果把图片设成背景，那么背景图片是不能随便缩放的。你只能控制背景图片平铺，位置等属性。因为CSS里面是没有控制背景的大小的属性，你的 width : 215px;height:25px;控制的只是容器的大小。
如果用JS控制还请达人来写吧，我水平有限没想到合适思路。
第二：你如果非要实现图片作为背景，那么我可以给你一个思路。就是你把图片作为img元素放到下层，然后控制img元素的大小，css有max-height,max-width,min-height,min-width,属性，但可惜的是IE6不支持，IE6只能用js控制，用js控制img大小很容易。
举个例子：
css部分：
.tu6-con{position:relative;width : 215px;height:25px;}
.tu6{width:215px;height:25px;margin-bottom:5px;}
.tu6bg{position:absolute;width:215px;height:25px;z-index:-100}
.tu6bg img{max-height:25px;max-width:215px;min-height:25px;min-width:215px}//IE6就用js控制，js自己上网下，有很多。
html部分：
<div class="tu6-con">
<div class="tu6"></div>
<div class="tu6bg"><img src="images/022.png"></div></div>

第三：我很无语你能想到这种办法控制圆角，你都不担心放大缩小引起图片失真？？？？
一般控制圆角都是把圆角部分切出来，然后单独写。。。。

LZ再仔细研究下一般网站圆角都怎么布局的...

热心网友时间：2022-04-21 11:39

大哥，你这个是设置背景图的，并不是表面层的图。如果你想设置缩放就不要用background.
而且你这么做有什么意义么？如果你要用背景为什么不设定好大小呢，背景拉伸也没必要吧。
如果你真想让背景也会根据你设定的大小缩放你的图的话，那你就只能写JS了。JS控制方法我就不会了。我刚才也研究了一下没弄出来。
你还是把background去掉吧。这样就能缩放了。

我刚才试验出来了一种方法，不过你得活用一下，用JS控制图片ID来改变大小，或者你可以不用JS直接改图的大小，但是要在图上加一个Layer浮动层。具体的参考我发的代码吧。代码写的并不是有多好，只是给你提供一个思路而已，加了Layer层以后别人就点不到你后面那个层的图片了。Layer层的图bgbg.gif是我做的一个1X1像素的透明图，你也做一个，然后就能实现Layer层透明了，JS的代码可以设定大小，你设定多大就是多大，不管你的图怎么添加都是设定好的大小。下面图片gaibian.jpg你随便找一个替换就可以了。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>galaxyyang</title>
<style type="text/css">

</style>
</head>

<script>
function yy()
{
var tt=document.getElementById("cc");
tt.width=100;
tt.height=60;
}
</script>
<style>
.aaa {
height: 200px;
width: 200px;
}
</style>
<body onload="yy()">

<div id="Layer1">
<img src="bgbg.gif" width="599" height="397" />

</div>
<div class="aaa"><img src="gaibian.jpg" name="cc" id="cc" /></div>
</body>
</html>

热心网友时间：2022-04-21 13:13

<img src="XX.jpg" onload="javascript:if((this.width!=215)&&(this.height!=25)){(this.width=215)&&(this.height=25);}">
背景如楼上所说不能改变，不过普通的图片你可以试着用以上代码。

热心网友时间：2022-04-21 15:05

只能把图片大小编辑成所要的大小再设置背景

热心网友时间：2022-04-21 17:13

IE滤镜但是不支持FF
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1.gif', sizingMethod='scale'

全部栏目

css 图片自动缩放问题