以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。 & x, i, b* {/ `, ?. {0 m/ S关键在于：max-width:780px;以及下面那行。1 J4 o' b# b) R 固定像素适应:9 ^, {: V, [6 L, s3 F
5 F$ \8 J2 h$ m+ w7 f I; pdotted; 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 _- y, i- W# Z+ ~
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> 9 I! q4 e1 A: A<html xmlns="http://www.w3.org/1999/xhtml";> 7 G% o3 m) e: x$ J0 e+ W<head> ) f% |6 b$ H/ T, m. e9 N! _
<meta http-equiv="Content-Type" c /> # ?9 U D/ V I- s- J1 `% d<title>css2.0 VS ie</title> / Q! I; o' q% }. F% Q
<style type="text/css"> 0 h/ R9 j" K4 }, t( B<!-- 4 j+ s+ A) r1 G; L5 |1 d
body { - r$ q8 \ W# R- _$ k$ tfont-size: 12px; & n) x1 a0 v2 {; gtext-align: center; # U' K* Y: v7 G
margin: 0px; . I; l' o7 I i8 Y9 U( k
padding: 0px; 4 h" @5 z. @& B% M( _
} 9 B+ q9 Y. o, u3 v/ G; \
#pic{ ) @8 g2 l6 y# X6 O5 p6 X, J
margin:0 auto; % u& J" o/ b p% G( L width:800px; 2 _# O# h: E' l, h
padding:0; ' z% ?+ ?% \4 Z1 M( i+ S
border:1px solid #333; ' K1 P8 V) D* s. q: m6 j0 B! X& s } 8 U6 c4 O2 v5 Z0 I% {8 C2 R( `- u8 f
#pic img{ 2 N8 E# r4 y( `* n. _
max-width:780px; ' T$ H5 Z/ g5 o7 Q- `- ?6 ?width:expression(document.body.clientWidth > 780? "780px": "auto" ); . R7 ~# \. u$ k* U# n) n2 \border:1px dashed #000; N1 a) f/ ]6 X3 v# @- J} 8 @( a! ]9 Y6 e9 b--> 9 [. F8 n. e. `( C/ b</style> . m4 g& s# f- f8 w' |! v5 l</head> / R: \+ {/ N! x1 m/ J
<body> " z* S6 i& m! ~1 T6 U
<div id="pic"> 9 S4 [# @* h- g
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> ) z& f& v0 p( t; G$ Q) R# y7 U
</div> * |) r U0 A' P d. f</body> ; u7 Z( \" W" d</html> ; `" B5 y1 E9 t 1 V7 s# ~4 U& y3 X* q9 H' U百分比适应:* @% T- R- |+ h
以下是引用片段：' q; Z! Y' l8 c" Z# a
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> 1 p: U: k+ t a* G- u5 D$ H
<html xmlns="http://www.w3.org/1999/xhtml";> 8 M2 q) Z! R9 U+ Z/ ~- x<head> $ a, F8 V& H% d. ~- X: ?% J T
<meta http-equiv="Content-Type" c /> * k. I# X( U. [8 q
<title>css2.0 VS ie</title> 0 c4 X2 s9 i" m2 H- w8 f3 q
<style type="text/css"> 2 E5 e$ m, y9 k/ G/ u4 _6 q- J0 X<!-- / S: P- q: E" D$ A+ L ^body { & K% u% E/ {8 @; Z, j7 X1 nfont-size: 12px; 1 J) D0 U! m6 d1 ] V. q8 I3 @
text-align: center; 6 W6 s) L5 g! L1 d1 _3 b- M4 g" h: tmargin: 0px; / t: W& N, e6 v2 Q6 M7 L1 t( {$ |padding: 0px; , Z( v2 O$ m1 Z& M& K/ q0 \
} ! |) w; [4 W2 ]: S7 z, B#pic{ $ G6 w. ^: B) n* z/ u+ ~7 i, U
margin:0 auto; : O$ l) R6 i% k0 N width:800px; ) r5 o# b0 h3 Q6 I
padding:0; J; R" N. O! E: [
border:1px solid #333; 2 e& @0 D. ?/ M5 x4 T
} ! \7 }. O5 B2 p. c, R/ R# C#pic img{ ?$ ^; e' I, ^) z. D+ m% I max-width:780px; * g( D9 x ]; |! [- r9 Fwidth:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" ); - }1 {7 j6 q% R2 }) ^% S" u
border:1px dashed #000; % `) S0 v$ n0 J3 `
} 0 v( P; h; R# y$ n! c* [--> # n* ^. U6 [; I/ W, h, o+ ~- P. V</style> ' n5 b7 G+ P% m</head> : K3 T Z% ? N' Z/ T0 B! V6 I
<body> % i/ V; y/ W1 R) m7 r. _8 r<div id="pic"> 5 J' ?9 B6 q3 i' q
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> 6 [2 ~2 Y0 H/ w</div> 6 Q: `$ G! V9 f" x( y</body> 8 B+ i; ~) Z$ y0 X/ M+ G</html>
