|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14341
- 金币
- 2456
- 威望
- 1647
- 贡献
- 1404
|
以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。3 Q+ j7 N6 L6 o6 F
关键在于：max-width:780px;以及下面那行。8 A D; V% h& y2 x: \% e4 W
固定像素适应:% E* \ J F" x. W
/ V8 X# ? j( |; G+ p! c v3 ~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> 以下是引用片段：
Z+ [6 g! q. l4 E( a9 N<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> R7 `, }, Y6 _# @# g B Z4 y7 P
<html xmlns="http://www.w3.org/1999/xhtml";> % h# [2 e% [6 R9 G- J1 g* A
<head>
$ S- e5 p; p, S<meta http-equiv="Content-Type" c /> 3 M7 S4 s$ R' ~8 [* f$ m: M5 m
<title>css2.0 VS ie</title>
% u7 \' z' |* B; V7 c6 A<style type="text/css">
; v" O1 `/ b- g' m. x<!-- . B* V' ] o. Z9 O" P
body { 3 y) W9 l1 B2 i
font-size: 12px;
+ J1 V% P& S* r6 Y: i6 A4 J7 Xtext-align: center; Z" @5 J+ D2 |1 c8 P* ]3 C
margin: 0px; 6 F2 m: z$ O1 v; K
padding: 0px; 0 {! q4 l: X; `# u) G4 c5 g7 D
}
) ~& Y( \7 L- ]#pic{
, k& Y4 r1 e: s- B) y0 t" ]* k margin:0 auto; & i5 M3 B8 p2 O
width:800px; - N+ @. Z( z' Y9 V" b
padding:0; & u. G- Y: }# h$ _/ u) U
border:1px solid #333;
" q0 ^8 x m6 N" T3 v0 H }
3 U: o" ]$ f% o* o' l+ w#pic img{
I+ }2 `) H6 X; s# R max-width:780px; . t8 C' o W, @ M, c
width:expression(document.body.clientWidth > 780? "780px": "auto" );
, n$ d5 |1 u4 n; k' R( Bborder:1px dashed #000;
. [4 Z; v! z/ e3 U2 ~! @. H}
* e5 e2 A- }" d( q' x/ m7 U-->
* q6 v6 v' w% z</style> ) K0 x2 I& f4 h
</head> 7 T& M1 g! c; |. T6 {5 R
<body> . _( y! J% k$ F, x! a3 h
<div id="pic"> 5 Y, V# e/ p" Y: q3 D
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> $ K. U7 p- V( u. b, b
</div>
2 _& }" l+ G5 N6 z</body> ) o7 V2 i' H' g! \3 J9 \
</html>
5 a a5 R' H5 ^7 V1 B
( g; q$ h# s5 V" d1 b( `百分比适应:
+ `; a! z; j2 Q7 I* x以下是引用片段：& C& {! g9 _/ W4 G; N. \1 A
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> . a- S8 P$ n: J$ `. V+ H0 M
<html xmlns="http://www.w3.org/1999/xhtml";>
5 }$ q9 s/ w1 i* p<head>
7 M& p( l9 O! e9 b<meta http-equiv="Content-Type" c /> ! O1 s S n% Z7 j
<title>css2.0 VS ie</title>
/ @; m% |1 d" C, o, T1 k<style type="text/css">
, C3 j% N6 d; y7 n5 E d<!-- ( b! G( `5 U6 o7 D; {( Z3 ~& C
body {
5 B9 d8 Y% A2 L# t, P4 gfont-size: 12px;
2 i0 K1 o, g, {" A8 @5 o9 H( utext-align: center;
1 v$ }! ~: c& X; ~$ _8 m+ g6 Nmargin: 0px;
6 a9 Q3 Y) r, s+ { ?5 b. Opadding: 0px; / Q, X( n# z. q0 W
}
/ C F2 E. K) L1 J9 H#pic{ 5 M, a, ~+ N3 [; l: b
margin:0 auto;
0 t3 z3 h' f4 R' s& x7 Z* d width:800px; / f3 V" \, ^9 _* r
padding:0;
; a* y! [: R) b Z5 b- K border:1px solid #333; 2 B- {& o J2 x, m. ]& j( r7 K, n
} 3 w, Y6 f& f/ G9 U$ W5 p
#pic img{ 8 ^3 x) e6 T+ w; K8 P/ `. i
max-width:780px; ( z- _% d, {6 k2 X i% {& d
width:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" );
! N) g4 g3 c$ y4 X8 R4 r4 E S; l4 O1 }' o3 Qborder:1px dashed #000;
5 \$ N) D: f# |* l" K7 R} - H) N0 y- O; T5 P% X1 u, s
-->
9 W' r6 w- p1 Q% M: ~9 }9 v</style>
9 c3 o- v' ^: m</head> ' h/ |" p" _( ^% S2 L
<body> 3 a- @& b2 w+ R; M7 i: A
<div id="pic">
% b2 u4 t# \, r: P& B7 c<img src=http://webclub.net.cn/images/Beijing2008/logo.gif>
- S7 ^$ U$ S8 C6 S& x0 B6 B</div>
6 d( Z, l, a7 Z7 g ~8 N</body>
. l& S% X/ R8 ?( {5 h</html> |
|
发表于 2007-12-8 14:55
| 