以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。2 I5 h3 W# F f7 `6 m# f
关键在于：max-width:780px;以及下面那行。' A, {8 w7 {$ S 固定像素适应:" I( f: I8 S; V) g* y
. v4 k' t$ r& W2 l- z2 [# ^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> 以下是引用片段： 9 H. {4 l- \* _. c. K+ p1 {5 u<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> % W5 I1 u6 D& q& W$ N
<html xmlns="http://www.w3.org/1999/xhtml";> , G* A& ]. ~8 u, N J' \
<head> / S) n+ S+ i' K2 b; j- X<meta http-equiv="Content-Type" c /> 4 w+ q z8 Q; B1 F- V) |<title>css2.0 VS ie</title> 4 O+ D8 p! B$ V* x% v1 ~4 @( T
<style type="text/css"> / \* S5 H- V4 F$ U+ d1 N<!-- . Y$ T1 f* R5 P$ ~2 J, H" u
body { 9 F0 i- z# Z% v# q' m! B
font-size: 12px; 2 ]4 v/ s' r# \" A5 [3 x) Stext-align: center; 3 R* W6 a- C! @
margin: 0px; 2 p) b. Y+ O4 D5 x, Y5 L$ A
padding: 0px; / X6 Z0 D5 @( ^1 t7 j: g$ S} ( h0 d( ?7 n5 ^$ ~2 e; M5 |#pic{ 0 z2 V- L( V' Z; j4 U5 h% L margin:0 auto; 6 s: Q7 _1 \$ {# V- ?' B% `
width:800px; - ?/ D2 o. {0 Q, D$ O3 ]) z) Q padding:0; . ]( s* x5 E, c5 P/ W; x border:1px solid #333; 4 ?2 a, |6 @; K9 @' r
} k; ]& C# V) \3 l#pic img{ E1 v2 M( J7 T9 ^! Z7 i; }! W8 s max-width:780px; $ ~# } V. v* o# lwidth:expression(document.body.clientWidth > 780? "780px": "auto" ); 4 o" O# w- g% eborder:1px dashed #000; & T' F- f) T2 o0 K2 a d} + t8 n5 v! u! W% T' w8 M, \8 }
--> , Y' q& T2 o% {; @. R</style> 7 r& B: e" R6 L</head> 8 f9 t: z/ A/ ^" @* A0 D<body> # I% I; k( t) }9 f<div id="pic"> + y# q" i* T1 [1 k' C
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> * |. a1 E& I1 b
</div> 8 O. N6 K5 f A8 c! T3 T</body> 3 @- g, ]! N6 U! F; Q5 g
</html> ' N1 B3 D0 ~- ~( T
0 x9 y) p9 h* Z. h2 B: K
百分比适应: 1 l J2 G _3 D9 e3 Q以下是引用片段：$ `9 Z$ y0 {: I B
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> + o8 Y9 ?8 |! O<html xmlns="http://www.w3.org/1999/xhtml";> * m7 u; a4 N% {6 |/ Z<head> 5 h' H/ i6 {. ~6 ^<meta http-equiv="Content-Type" c /> 0 l$ x P5 _/ d( B1 z; H( V3 x/ T
<title>css2.0 VS ie</title> 2 L& P- r1 H" e<style type="text/css"> # e8 \% V; N V1 M3 O7 U<!-- - O$ D1 j( y8 z. \% o0 c7 K
body { ; |& W o% z' I5 Q% z: wfont-size: 12px; $ g4 s$ |/ `- x: u6 F
text-align: center; 3 T- U- l# J# ~) a5 b: a( Q) ?& V
margin: 0px; 1 h5 w5 W* U$ [0 q
padding: 0px; ; ^) z0 l/ `3 i2 c6 b} + D4 }0 O w; q6 x& E. u#pic{ 5 ^1 K& J {4 P1 l6 C6 C
margin:0 auto; 5 P' N' U4 f j2 C: ]* M
width:800px; 5 Y Q' j+ _/ C% j# F padding:0; 4 X; h/ E7 E+ f) ]7 }* `' ]# x' C
border:1px solid #333; 9 V9 x( Y, M5 f T! M' U' x } i* f/ X& U) j% n/ i+ l
#pic img{ - W0 d$ U1 U f$ Z$ A max-width:780px; 4 o, V9 B" Q% ?4 u# A k
width:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" ); ) q: n- z4 J' F; x/ h4 D7 C& v$ ^
border:1px dashed #000; 2 w5 F: _8 H% G, T( S b} ; P$ C) [% p, s9 [* I! Z- B5 `
--> + ?# Y9 X u, J" J
</style> : ~- c$ ?. H8 N+ W5 ^& c
</head> # A8 d2 x; w% a* c# d+ I
<body> Q( i" D& S1 |1 _* _4 w5 z8 {<div id="pic"> - P, L. c& @* M6 U
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> # A0 T; X8 z* W# f$ z6 l: c</div> % g3 C% d; R7 b1 U0 R
</body> - z# ^; D( P* v, A' n3 ?1 u4 o
</html>
