HTML标签img--改变图片尺寸
Posted 一枪尽骚丶魂
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了HTML标签img--改变图片尺寸相关的知识,希望对你有一定的参考价值。
1、统一大小?
我的网页上面有许多的图片,有的大,有的小,我想如果图片大的实现缩放,所有的都是一般大。来看看没有是什么效果。
大家看的出来,非常的难看的,于是我想让有没有一种方法是把那个大的变成小的呢?
<li><img src='http://pic2.ooopic.com/01/03/51/25b1OOOPIC19.jpg' width=400px height=400px /></li>
效果图如下:
但是如果图片太小了呢?就会被放大,好难看!!!有没有什么办法让大的变小,小的不被放大的方法呢?
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>食物详情</title>
</head>
<body>
<ul>
<li><img name="pic" src='http://pic2.ooopic.com/01/03/51/25b1OOOPIC19.jpg' /></li>
<li><img name="pic" src='http://baike.soso.com/p/20090711/20090711101754-314944703.jpg' /></li>
<li><img name="pic" src='http://img2.3lian.com/img2007/19/33/005.jpg' /></li>
<li><img name="pic" src='http://img.taopic.com/uploads/allimg/130501/240451-13050106450911.jpg' /></li>
<script type="text/javascript">
function setImg(w, h)
alert("111");
//var imgList = document.getElementsByTagName('img');
var imgList = document.getElementsByName("pic");
for(var i=0;i<imgList.lenght;i++)
alert("222");
if(imgList[i].width>w || imgList[i].height>h)
imgList[i].width = w;
imgList[i].height = h;
setImg(400,400);
</script>
</ul>
</body>
</html>
效果如下:
感谢论坛大牛:无爱大叔
以上是关于HTML标签img--改变图片尺寸的主要内容,如果未能解决你的问题,请参考以下文章
HTML图片区域链接注意事项与Gimp基本用法——零基础自学网页制作