|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14427
- 金币
- 2499
- 威望
- 1647
- 贡献
- 1447
|
以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。) N l4 a- m9 a1 L) ?% |$ v
关键在于：max-width:780px;以及下面那行。
+ m- k) E9 J% E; U( y固定像素适应:( e" L8 X7 v5 ^4 A" }
0 j1 Q) r8 t- { U8 Q' G% N! D; ?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> 以下是引用片段：
; R0 @7 M& a" V; j3 F<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> 8 u: S r* v6 q0 I8 c1 w
<html xmlns="http://www.w3.org/1999/xhtml";>
7 R% h4 B" O0 f* a- x# ~: J) L<head> 4 \7 \* I# Z$ ]( J
<meta http-equiv="Content-Type" c />
6 q; q% t1 }7 s! `* E<title>css2.0 VS ie</title> 8 [/ ~1 ~4 g* y' Q, Q
<style type="text/css"> ) I1 p% d" q- h8 {4 e
<!-- 6 v* Q% j, b/ j- a
body { 9 J6 q/ u% d. y; t# o
font-size: 12px;
* D4 h9 w( x0 }/ Ntext-align: center;
) E% L$ a# X" _" e* F8 o* _margin: 0px;
7 ~7 l2 X; d. K* z6 s- [$ \# ], }padding: 0px; 1 p4 W& W- X1 a, a7 Y4 E. Q9 I N7 n
}
' _3 d3 I5 @7 \$ t3 a#pic{ ) y2 d3 a- P8 S. [. R, B% o
margin:0 auto;
3 [1 f( S; z3 t width:800px; 0 x' u2 ]; F6 N, A( N$ D
padding:0;
- T" \! {4 v$ @0 v6 f border:1px solid #333;
" s, k8 X. g% {3 g0 p5 W } % h0 q, ?6 @2 S
#pic img{
/ \4 i/ k2 z) I8 G$ ` max-width:780px; & E9 L" |: l9 r
width:expression(document.body.clientWidth > 780? "780px": "auto" );
g9 I7 S2 r2 C' Y+ r) D# t, A0 Cborder:1px dashed #000; f) D6 V/ N/ C, |3 x! l
} , B: s) U( q: D6 r; i, v1 H
--> ' V* x9 v5 e+ X; |. |. f
</style>
" C% D' [6 Z$ `- c8 s7 T4 u</head> + i' C/ [" V# t
<body>
4 C v- C: G. ?9 n- G4 ~<div id="pic">
2 S# x, x" ^0 T/ e5 F* x<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> 1 R3 m/ R6 v4 a3 k Z6 e
</div>
, d1 O, f2 O# b; f</body> / E4 g4 g) j/ W: Z! c3 j
</html> ' A$ N* `+ m( J9 z, Z9 c4 n
# j/ T0 s3 E) n. V百分比适应:
% a3 ~; j! F- U8 t- I( H3 ], y以下是引用片段：. ?) |6 R3 o) f! T' D8 ~
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
' |/ M' {/ w5 v- B! V% p: c9 x: `<html xmlns="http://www.w3.org/1999/xhtml";> - M* W6 @ ^5 q: M6 {
<head> 0 `; t, C6 J5 z
<meta http-equiv="Content-Type" c />
2 o+ e0 n. a& N; `- }) K9 `. x/ |1 V<title>css2.0 VS ie</title> ( y4 `6 f' h% l' s3 b+ a/ s/ A
<style type="text/css">
! S7 {* X" M S$ x<!-- * }7 I3 |' K$ K* b% i( }* @, g
body { ( }9 k- o$ M+ j
font-size: 12px;
6 l5 p7 v7 {! @* N0 Ktext-align: center; 8 X. l/ t% o6 w; u9 {* `8 p; g U
margin: 0px;
9 e3 g( r0 d z8 {. Y( k. opadding: 0px; * s0 d+ u: ]5 i
}
, H5 C3 k5 C) W7 K" T" n! ]#pic{ ; @* T: _# f9 Y" l
margin:0 auto;
+ x& x( F- Y- z width:800px; ) \- b1 G0 f( \5 V, B8 l
padding:0;
( Y% d* ?+ y/ n* \. B/ s" M border:1px solid #333;
: f5 X" O/ C( A r }
8 ~% q* X$ R2 ^: j! J5 ]. M6 V#pic img{
3 F. G2 |- r* Y) R) [6 t max-width:780px;
0 O' }0 B: x' T/ F: Z/ [% G" O* Ywidth:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" );
% f e/ j8 c& o% iborder:1px dashed #000;
3 c# L9 B5 M* Z}
% V0 ? i: N8 T% [' P& L8 r% q-->
: \% m- B1 y) p6 |</style> 0 U5 _% T' p) h) L- R v$ k
</head> $ s+ @# _3 @( `- p0 z: b2 J# \
<body> * {8 f( e7 K( @; G- z2 j4 n% l
<div id="pic"> % r" q. }% w7 M* X. F: l' Q c
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif>
9 ]0 \9 ?$ j$ ]0 ^</div>
8 u+ u% M! N# \</body>
3 e" h! z* n1 r</html> |
|
发表于 2007-12-8 14:55
| 