在DIV下图片自适应的解决方法
以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。3d)S*M/vKm3s关键在于：max-width:780px;以及下面那行。
[b]固定像素适应:[/b]
dotted; TABLE-LAYOUT: fixed; BORDER-TOP: #cccccc 1px dotted; BORDER-LEFT: #cccccc 1px dotted; BORDER-BOTTOM: #cccccc 1px dotted" cellSpacing=0 cellPadding=6 width="95%" align=center border=0> 以下是引用片段：/n~/b0T6i
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> 0bsADoe
<html xmlns="http://www.w3.org/1999/xhtml";> Jme ~,k L
<head>
<meta http-equiv="Content-Type" c />
<title>css2.0 VS ie</title>
<style type="text/css">
<!-- ,O4G7Y m*I Y-\nk!x)g
body {
font-size: 12px;
text-align: center; fBf'|0zB%}
margin: 0px; o\9J K)o!C
padding: 0px;
} $S}p:y z9m"E^
#pic{
margin:0 auto; 3~5D nT!j)?9jr
width:800px; 0U;?r }1S}!\
padding:0;
border:1px solid #333;
}
#pic img{
max-width:780px; #[%Uy"e:A-? x
width:expression(document.body.clientWidth > 780? "780px": "auto" ); hK3[9P.{\
border:1px dashed #000;
} L-Odz FN\3~+_ o0M
--> /NL#_A n |"J)Ko
</style> 6W `/SS3e:h
</head>
<body>
<div id="pic"> ;i,C P"I?
<img src=[url=http://webclub.net.cn/images/Beijing2008/logo.gif]http://webclub.net.cn/images/Beijing2008/logo.gif[/url]> \ |R'H8Cdt*{ tt
</div>
</body> A:rS"Wn_Pv"s
</html>
!{6avpM7o
百分比适应:
以下是引用片段：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
<html xmlns="http://www.w3.org/1999/xhtml";> Ou"f:m sO3VM!H'?
<head> H f'`x1H/E f p
<meta http-equiv="Content-Type" c />
<title>css2.0 VS ie</title> GM+wY7AM
<style type="text/css"> x4F3P[xD6`cD
<!--
body { pwq BQ3N)BQ
font-size: 12px;
text-align: center; /m7q#g)D-ya-p T4V
margin: 0px;
padding: 0px; ;i\V)iy)AO3i-P;?
} 'x [)\(M`(K3lQ0N
#pic{ 5DU|^(J W"B`5t&@`
margin:0 auto;
width:800px;
padding:0;
border:1px solid #333;
}
#pic img{
max-width:780px; 9w7Y[W$?GY
width:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" );
border:1px dashed #000;
} MM i;Sx4a
--> %cYs+NRr{ m
</style> %s%["IU6Z u'p {
</head> v/q xLT;cC4B"J A
<body> %c%MG w,eT9`1[
<div id="pic">
<img src=[url=http://webclub.net.cn/images/Beijing2008/logo.gif]http://webclub.net.cn/images/Beijing2008/logo.gif[/url]> od${4B fX/[V
</div>
</body> oTp.J:N-w
</html>
页:
[1]