|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14163
- 金币
- 2372
- 威望
- 1647
- 贡献
- 1320
|
以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。
8 d5 S2 H# \. N9 V4 W关键在于：max-width:780px;以及下面那行。
2 M% A, Y3 P$ j- }) ]2 E固定像素适应:
7 D% e |# \' b6 {& l0 @* J1 e2 r+ A. l9 |; |* I7 ]
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> 以下是引用片段：
7 e4 n3 L8 m. v, s% r<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
4 _6 o, |6 }# x G) u0 i, {8 B<html xmlns="http://www.w3.org/1999/xhtml";> , e4 n% r0 g( C; ^
<head> & Q9 F e5 Y7 s3 G% m6 @
<meta http-equiv="Content-Type" c />
" G' j2 V2 c9 L1 n<title>css2.0 VS ie</title> # x2 c: Q9 u) ~6 N; ~
<style type="text/css">
/ A2 T3 U5 b* D5 m" Q# V<!--
6 L3 p: l$ E8 Nbody {
; F3 u9 F! N/ h. g8 x: I8 Vfont-size: 12px;
$ X* w% a. X2 x p! itext-align: center; ' U9 {+ E. o) y
margin: 0px;
# M' a" X$ F9 }2 @' cpadding: 0px; $ e# @ S) I+ D9 G) q7 _
} : l) N, C% m6 A; ]4 u
#pic{
( K6 L1 V7 P5 ~8 k" R margin:0 auto; * S- c) N; F. b! v
width:800px; ( O4 w$ G; J( U5 O5 G: W$ s) B! J
padding:0; * s0 R3 C- J) R' R# _" Q
border:1px solid #333;
; W: Q# j5 J) l C P, Y9 t } 7 h( ]# M9 `; k, l7 b8 I" O& }
#pic img{
5 e5 S9 }3 |/ G0 B1 T) |" X/ ~ max-width:780px; 6 m2 w: Y/ v1 O0 n6 q
width:expression(document.body.clientWidth > 780? "780px": "auto" ); - S6 e. p. K1 T; F, V7 l
border:1px dashed #000; 4 K! ]6 A8 C4 l1 a
}
( ]6 m3 n, i, A--> 2 @, y/ G8 U+ |
</style> 4 ?* D8 D( s. q: H- Z7 _! R+ E& v2 O
</head> A6 z5 v' }% t8 m
<body>
6 [! o' V3 |! o; u: F$ i- A1 |<div id="pic"> % l+ {% K. I( |. |6 @+ y
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif>
" D" l$ i& ^9 _2 S</div>
3 k+ Q- z* l( M' |) X</body>
* j V/ z% M2 f# Y) N! u- |</html> - x+ F& }: b5 @8 j. L6 o
- O( U5 o J8 c% ^9 H3 t
百分比适应:) {9 q+ w. M3 t( K+ `2 \
以下是引用片段：" r# @7 P k z. x9 G
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> 2 P/ O2 V( g6 i' K) ^4 x f2 R( R
<html xmlns="http://www.w3.org/1999/xhtml";>
, J. }/ t' U0 `% S, H& _& T<head> - b7 t9 A3 k5 N2 z Z+ p
<meta http-equiv="Content-Type" c /> " p- h7 u- e% B& n. x! c7 r
<title>css2.0 VS ie</title>
" U$ e1 F0 o, u3 |0 `0 }6 c3 Y<style type="text/css"> 8 Q* {/ C7 R7 J- {
<!--
* [( E( ^5 x( M$ Z- g1 ~body {
& f% o; f* i5 H+ }1 K/ f0 Zfont-size: 12px;
7 e& N9 E7 [2 B/ p4 h% m. M4 ftext-align: center;
7 y0 w% P. E$ N2 ~+ j0 ?margin: 0px; $ a z: I5 x& z7 k6 S9 I
padding: 0px; ' Y# F) b% N. o @
}
# z8 x# P! p6 ]" _4 K#pic{ - Y. `# _2 |7 ~' L. r& G
margin:0 auto;
; _! c; p1 V. _ L3 _% B width:800px;
. Q- F; v7 S- |; H( o padding:0;
) w- f6 B! J" g$ r4 \- i6 w- T' H border:1px solid #333;
( a- m4 ~" b) T } 5 t2 u M8 v! X v! `% r" D# N
#pic img{ ' T5 N a6 a4 a7 ~1 ^0 T- Y& P& n
max-width:780px; ^8 ?2 F/ a# W5 \
width:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" ); - x" A2 u# d8 g C, S
border:1px dashed #000; , ~0 s8 M* ~8 a8 ]
} * i/ `, o4 `' H
--> $ L& b4 u* x9 V* ?. }
</style> 0 b3 p$ b5 n, F/ }" O0 J
</head> 4 c9 ^5 C. }' b. ]
<body> A: g. Z. [8 D
<div id="pic"> ' e: F' e! F2 b6 o
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif>
3 p# R2 J4 ]$ f% B* c Z</div>
, J' C, a; y9 T: d( ~* a. e' a</body>
. s" Y: s/ }+ E& E</html> |
|
发表于 2007-12-8 14:55
| 