使用javascript,根据你的设定设置img大小,这里有个例子:
function AutoResizeImage(maxWidth,maxHeight,objImg){var img = new Image();
imgsrc = objImgsrc;
var hRatio;
var wRatio;
var Ratio = 1;
var w = imgwidth;
var h = imgheight;
if(w > maxWidth){ //判断宽度大于可视化的情况
wRatio = maxWidth / w;
hRatio = maxHeight / h;
if (maxWidth ==0 && maxHeight==0){
Ratio = 1;
}else if (maxWidth==0){//
if (hRatio<1) Ratio = hRatio;
}else if (maxHeight==0){
if (wRatio<1) Ratio = wRatio;
}else if (wRatio<1 || hRatio<1){
Ratio = (wRatio<=hRatiowRatio:hRatio);
}
if (Ratio<1){
w = w Ratio;
h = h Ratio;
}
objImgheight = h;
objImgwidth = w;
}
}
以上是js的方法
下面这个是引用的img
<img id="lc_div" src="路径" onload="AutoResizeImage(500,500,this)" />
<div style="position:relative;width:300px;height:200px;border:1px solid red;float:left;">
<img src="img/header_rightjpg" style="width:300px;height:200px;">
<div style="position:absolute;top:0px;left:0px;">这里放入内容1</div>
</div>
<div style="position:relative;width:200px;height:100px;border:1px solid red;float:left;">
<img src="img/header_rightjpg" style="width:200px;height:100px;">
<div style="position:absolute;top:0px;left:0px;">这里放入内容2</div>
</div>
<div style="position:relative;width:100px;height:50px;border:1px solid red;float:left;">
<img src="img/header_rightjpg" style="width:100px;height:50px;">
<div style="position:absolute;top:0px;left:0px;">这里放入内容3</div>
</div>
html简介:
超文本标记语言,标准通用标记语言下的一个应用。 “超文本”就是指页面内可以包含、链接,甚至音乐、程序等非文字元素。 超文本标记语言的结构包括“头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息,“主体”部分提供网页的具体内容。
字符集:
在网页中除了可显示常见的ASCII字符和汉字外,HTML还有许多特殊字符,它们一起构成了HTML字符集。有2种情况需要使用特殊字符,一是网页中有其特殊意义的字符,如:;二是键盘上没有的字符。
HTML字符可以用一些代码来表示,代码可以有2种表示方式。即字符代码(命名实体)和数字代码(编号实体)。字符代码以&符开始,以分号结束,其间是字符名;数字代码也以&符开始,以分号结束,其间是#号加编号。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)