以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。* Y$ p2 j4 G' K: w; A: s
关键在于：max-width:780px;以及下面那行。1 Q6 T. m+ y" e. M 固定像素适应:# A( _& _# O" t3 ]. \! Z
8 t1 d, N- r( E- S; y- @8 A+ Q( }( Idotted; 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> 以下是引用片段：% j6 W7 ?% I. a, Z# l8 { t
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> 3 W+ D9 Z: `( }, v- k/ d
<html xmlns="http://www.w3.org/1999/xhtml";> ' R, s" A7 f# B/ S1 \8 {3 h7 `
<head> " H' G" y# n; n2 w- P m& j<meta http-equiv="Content-Type" c /> $ K- O2 X% ^- f: f" z
<title>css2.0 VS ie</title> 5 k: f( [* i' h% {2 b<style type="text/css"> 2 T+ N( G" Q$ [! B+ ?<!-- ; l1 A2 h% N0 W1 tbody { $ k+ J* I5 t+ C+ R7 ~& g
font-size: 12px; : h+ A! l( I& g' K3 y; U% r' {text-align: center; T, S& a, E, [& `
margin: 0px; ' i# F; u( |3 e5 K3 q {& L# Xpadding: 0px; 0 i9 L9 o9 i. s K' G l( d( ]} 5 V0 f6 y* v( S/ _9 p, o5 l* \
#pic{ * _# c8 `7 f* u- V5 C j7 z o margin:0 auto; $ Z+ e5 `! Y0 P. P7 i6 z. b& ? width:800px; * q6 z) P) Q! b6 N1 z padding:0; # y8 \# a7 m+ C3 {3 c. e! m6 v border:1px solid #333; 3 ]; x( E \! m
} : Q/ y, y5 P) l- U/ i# C1 n#pic img{ 0 F/ |9 C. c5 q& L# Q, A# c; P3 F
max-width:780px; ' D* l- a8 |/ x/ @
width:expression(document.body.clientWidth > 780? "780px": "auto" ); - j, O0 t7 |% M% g" Iborder:1px dashed #000; ' c) l/ W% l; C) P5 {$ L" j) X} ! f" e) _) s: ]& \, [; k1 y: d( _
--> ]8 M: h" [) S! y. Q6 M% r</style> # @4 r3 C: u# A) n
</head> : K* x4 n r6 c/ K<body> 3 J& |; l: k' H/ O: @- v<div id="pic"> 7 h/ _2 j3 b5 O. N& R; L8 g
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> 8 [& S- Z( M5 @- I$ }4 K
</div> 9 M" e$ B$ x1 A" |) X; c</body> 6 n* @8 N& q- ~2 z$ _, y) u
</html> 9 J8 _5 Z# Y$ N, w/ {8 M7 i( W$ J( t# |2 E# Q2 p% |4 v2 J
百分比适应: # V6 M4 G: [& y* V以下是引用片段： 5 H* R( s" X" f/ r% j: E<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> / J' H! x6 r) E+ w<html xmlns="http://www.w3.org/1999/xhtml";> 9 {) T. @0 |7 q% g1 U: }<head> - M9 Q# H4 g9 }
<meta http-equiv="Content-Type" c /> 2 ` w7 q& t9 i. s) l<title>css2.0 VS ie</title> 9 r# d5 ?; m7 K3 b- W+ R$ m% k
<style type="text/css"> ; ]$ N$ f- U0 w# @; z+ @6 }/ v<!-- % g! C# O0 K' p6 q) Bbody { ( m% k C0 j4 a- Q8 [& c/ t
font-size: 12px; ' u0 |/ @0 T3 l3 Utext-align: center; ' }1 t) H# I. J3 Z& ?& ], r4 |
margin: 0px; % _' ]; S* X1 Mpadding: 0px; , u6 q9 P) d' Y& e- O
} o2 V5 `5 i+ j, k- u! i
#pic{ 7 `" K/ F+ D% M9 y% l4 y
margin:0 auto; - u) ?: x& R Z4 [! [7 M9 V width:800px; / ?0 R: ^/ v, S; k7 ]2 S3 O/ ^
padding:0; - h6 E9 ?+ Y( a! g+ R: [0 e
border:1px solid #333; ' Q. F% m0 |4 N" O" y+ p } - B0 U& D- z- y/ u9 U
#pic img{ ; x' K8 u0 ] _: b0 f; ]- h. H max-width:780px; * A8 V& _. m/ J& s* y% j! z
width:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" ); . r- o% M1 g# C" m% `8 o* cborder:1px dashed #000; : e4 S# Q# T @' P
} 6 S' v# R; K- c+ M, V
--> ( s, w8 E' x. t) W</style> 6 _3 w( M) k% D; d
</head> - u& u7 b- M- g& T# ^. ~) D
<body> + I8 h0 r6 j7 Z
<div id="pic"> " n9 K4 b# x3 O) P9 b
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> 4 a( x2 ~" _+ k" Z
</div> % ~, M2 J6 ?( C1 G5 Y</body> 5 C: v+ D& x& Z; H
</html>
