DIV下图片自适应解决方法

整理文档很辛苦,赏杯茶钱您下走!

免费阅读已结束,点击下载阅读编辑剩下 ...

阅读已结束,您可以下载文档离线阅读编辑

资源描述

DIV下图片自适应解决方法星狮创想肖坤前2013-02-01以前的解决方法主要是利用js来实现,但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。关键在于:max-width:780px;以及下面那行。固定像素适应:dotted;TABLE-LAYOUT:fixed;BORDER-TOP:#cccccc1pxdotted;BORDER-LEFT:#cccccc1pxdotted;BORDER-BOTTOM:#cccccc1pxdottedcellSpacing=0cellPadding=6width=95%align=centerborder=0以下是引用片段:!DOCTYPEhtmlPUBLIC-//W3C//DTDXHTML1.0Transitional//EN==Content-Typecontent=text/html;charset=gb2312/titlecss2.0VSie/titlestyletype=text/css!--body{font-size:12px;text-align:center;margin:0px;padding:0px;}#pic{margin:0auto;width:800px;padding:0;border:1pxsolid#333;}#picimg{max-width:780px;width:expression(document.body.clientWidth780?780px:auto);border:1pxdashed#000;}--/style/headbodydivid=picimgsrc=/articleimg/2006/03/3297/koreaad_10020.jpgalt=感谢blueidea被我盗链图片!//div/body/html百分比适应:以下是引用片段:!DOCTYPEhtmlPUBLIC-//W3C//DTDXHTML1.0Transitional//EN==Content-Typecontent=text/html;charset=gb2312/titlecss2.0VSie/titlestyletype=text/css!--body{font-size:12px;text-align:center;margin:0px;padding:0px;}#pic{margin:0auto;width:800px;padding:0;border:1pxsolid#333;}#picimg{max-width:780px;width:expression(document.body.clientWidthdocument.getElementById(pic).scrollWidth*9/10?780px:auto);border:1pxdashed#000;}--/style/headbodydivid=picimgsrc=/articleimg/2006/03/3297/koreaad_10020.jpgalt=感谢blueidea被我盗链图片!//div/body/html

1 / 2
下载文档,编辑使用

©2015-2020 m.777doc.com 三七文档.

备案号:鲁ICP备2024069028号-1 客服联系 QQ:2149211541

×
保存成功