防止表格被撑破
2006年10月27日

一、使用<img src="pic.jpg" width="400" height="300">直接固定图片的大小。


        这种方法不会引起页面显示的错乱,但是显示的图片经常是变形了的。


        最不推荐了。



二、使用<img src="pic.jpg" onload="javascript:if(this.width>300){this.resized=true;this.style.width=300;}">


        这种方法会在调用图片的时候,会自动按比例缩小到指定的宽度,不会引起图片的变形,并且也不会撑破表格,因此就不会引起页面显示的错乱。


但也有一个缺点,如果图片太大,在显示图片过程(下载过程)中,还是会先以图片原大小显示,这时就会撑破表格,页面很难看。当然,当图片完全显示之后会自动缩小的。



三、为了防止图片撑破表格,在上述基础上,对表格进行限制:


在表格的标签<table>中加入一些限制代码,<table width="500" border="0" align="center" cellpadding="0" cellspacing="0">就可以有效地防止表格被撑开了。



四、更进一步,用鼠标滚轮可以缩小放大图片的代码:


<SCRIPT type=text/javascript>


function bbimg(o){


 var zoom=parseInt(o.style.zoom, 10)||100;zoom+=event.wheelDelta/12;if (zoom>0) o.style.zoom=zoom+'%';


 return false;


}


</SCRIPT>


使用方法如下:


<img src="pic.jpg"


 onmousewheel="return bbimg(this)" onload="javascript:if(this.width>500){this.resized=true;this.style.width=500;}">


也可以用样式:

img {

max-width: 500px; width:expression(this.width > 500 ? "500px" : this.width)


}


  • 相关文章:
« PHP中session使用调试中碰上的问题Microsoft OLE DB Provider for ODBC Drivers 错误 '80040e4d' , 未与信任 SQL Server 连接相关联 »

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

最新评论及回复

最近留言

最近引用

Search

站点统计

  • 文章总数:181
  • 评论总数:2
  • 引用总数:0
  • 浏览总数:91446
  • 留言总数:1
  • 当前主题:footoo
  • 当前样式:footoo

图标汇集

  • RainbowSoft Studio Z-Blog
  • 本站支持WAP访问
  • 订阅本站的 ATOM 1.0 新闻聚合
  • 订阅本站的 RSS 2.0 新闻聚合

Powered By Z-Blog 1.8 Spirit Build 80722

Copyright Lunji.com Some Rights Reserved.