|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14443
- 金币
- 2507
- 威望
- 1647
- 贡献
- 1455
|
以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。) d" t2 s4 R% e) k: d+ f F+ [; J' L
关键在于：max-width:780px;以及下面那行。# R4 q3 i, L0 j. n+ X$ r- B
固定像素适应:
+ d+ |+ L! S8 o( K' Q' G9 h# T; w# n! @; y% F! F
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> 以下是引用片段：
; d9 k% b, {6 `9 l3 K<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> , l( @! W% B. G2 R+ ?
<html xmlns="http://www.w3.org/1999/xhtml";> + O! W" c6 |! V
<head>
" e, f" \$ s' X9 r- Z8 _( R<meta http-equiv="Content-Type" c /> " X1 Q6 B$ w# j3 `/ M! j
<title>css2.0 VS ie</title> u' T4 i! w4 q
<style type="text/css">
/ N) v4 d6 ?+ d% ~' Z<!--
# ^0 }7 ]6 u/ o, t! f7 @body { 3 F* j/ I7 @6 Z, d: h
font-size: 12px; ' S& T/ k+ w' j) y# J
text-align: center; 4 O! v1 O* F& j/ v8 p
margin: 0px;
, l( g' b6 t3 }+ l* Z, T6 p( M( ipadding: 0px; - y0 H1 u% X0 ^" _
} , H+ H, x9 p% X+ T4 Y) M+ \
#pic{ 3 @2 B7 z$ N: G0 i
margin:0 auto;
/ N% V4 N* ]! O width:800px; # h! w2 S7 w8 X3 f
padding:0; - t/ Y9 _) K# t* J+ v' Q4 x/ b
border:1px solid #333; % Z$ N2 ?0 d A% [; j
}
1 f. i8 {7 v' v, S% O+ c t#pic img{
. S9 x+ b) Q7 V2 S5 G. E1 V6 A( C max-width:780px;
, H# w, ^& B! N: Twidth:expression(document.body.clientWidth > 780? "780px": "auto" ); & j$ W2 l' k- @
border:1px dashed #000;
( k1 ?. m- f4 p* r8 T) u8 f; L1 W} ; Z* m o6 b( P4 V! V- r
--> 2 v# |( b+ _6 a7 [% O
</style> - C4 y6 I5 I: C n# R W
</head> # b* [% G$ m+ m& h; a
<body>
" W% _3 H; \) Y) y6 R a6 B- Z<div id="pic"> 5 l+ Q- k' Z) C3 p& D. V$ |5 d/ p
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif>
" [; Q0 g8 e& l0 y4 J</div> 2 @7 t" G; y! I
</body>
3 z5 y. X# J. f; q- k</html>
; _: L0 y; v6 K& Q8 p% X$ W$ x
2 }: s* E9 S) ?百分比适应:
) _# A H/ r& C _5 Z" J! _以下是引用片段：
) r k2 {* H/ P7 }' B<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> ) U4 G% H( R" z* |& Q6 t9 E- W
<html xmlns="http://www.w3.org/1999/xhtml";>
5 ?/ y( ]! y2 u2 a9 @- l<head> $ O& s! e/ F8 R" _
<meta http-equiv="Content-Type" c />
" T1 l; f C0 a# f<title>css2.0 VS ie</title>
4 `- T7 | v O3 R- D" m: z<style type="text/css">
: |0 i7 Z; m; k$ W' d4 q2 `<!--
9 i7 k; T5 l! ~ abody {
6 c6 D: F1 y" t- p) [. Yfont-size: 12px; # p. ~' ]0 s' g
text-align: center;
% p) X% I4 M* Gmargin: 0px; * X" V; T' L& R N
padding: 0px;
1 s- D5 N h0 U. i6 S} & y( I' \$ b* V& y0 f
#pic{
" L" {+ y3 q; \ X margin:0 auto;
! k/ R* u! o1 L" w- [2 r1 ? width:800px; ; Y* x4 }: P' m R$ g
padding:0; + H; @% [4 U8 }0 r' _
border:1px solid #333; r: }, ?* u% l# i
} ; k! y- {8 `3 B$ r
#pic img{ 0 `5 b7 ~2 U% G
max-width:780px;
' T; R3 N& b. h2 iwidth:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" );
; f, N- o! t e8 w! E' Q4 pborder:1px dashed #000;
) p y$ A/ B' Y6 n F$ C; y}
" j( [$ l+ f8 \8 c-->
! l& F' F) i" I</style> " z4 V0 m+ I) F& }/ ~$ s8 I. y9 }" h$ q
</head> 4 c9 j/ l$ |" |* Y3 U/ E
<body> - p6 ~* V! g$ t, j5 L& @
<div id="pic">
4 ~. X/ P& i% `<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> $ V/ j3 m" _# a& O
</div> ! J& i1 u5 J$ {% h7 u' N# E
</body> " B- P' Z- X$ K: t, ]
</html> |
|
发表于 2007-12-8 14:55
| 