|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14247
- 金币
- 2414
- 威望
- 1647
- 贡献
- 1362
|
以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。2 A% D- H8 c) x9 s
关键在于：max-width:780px;以及下面那行。
# G; l3 t* B/ W3 j) N7 G固定像素适应:9 o/ S4 m4 }; Z
- e" y0 }* z, n# @$ Ddotted; 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> 以下是引用片段：5 m1 D+ ^" Q& {& W, G/ w
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> * t# M2 N4 g+ ]* {' q+ L1 O3 W* w
<html xmlns="http://www.w3.org/1999/xhtml";>
! u9 f; Y" y( ?' ?3 a1 Q" B+ p<head> 6 E6 c+ \0 W# P# E
<meta http-equiv="Content-Type" c /> + l6 N1 T& Q! s4 U* T6 Q" s( z
<title>css2.0 VS ie</title> . a/ C2 p! |2 N$ ~
<style type="text/css"> 4 R% i# q: R& h. }7 @% ?4 E( ^
<!--
3 `6 p. c r) cbody { I" F5 ]& g' R
font-size: 12px;
2 z; ~8 G( Z3 q. J0 Rtext-align: center; & P2 E# @1 F( m+ x( T0 \
margin: 0px; $ z3 a* T3 l; E( \/ V6 [" A* i7 I
padding: 0px;
; `9 L" |" m7 U1 `* Q} 0 Z! M' Q, }/ O4 L: O/ Z6 a% s
#pic{ 0 L3 c: F2 Y N
margin:0 auto; 9 L! |: E4 T/ b
width:800px;
+ n: W! _5 i: ?4 C3 P) v- J2 Q padding:0;
' E1 J/ a8 S5 o border:1px solid #333;
3 V" \1 E; J7 Y0 f }
4 h9 O* l# _& B. F) }" h0 P#pic img{ , [) A6 L2 a2 ] y* K! S
max-width:780px; ' F7 T( ^9 ]" ?/ B& _
width:expression(document.body.clientWidth > 780? "780px": "auto" );
8 y# d' @9 L5 N' v$ A. d, I1 gborder:1px dashed #000;
9 T# p: Y" S$ B7 u1 x}
. z( J2 z9 [6 R9 Y4 S# S--> & l/ i) s- J& {4 E4 F
</style>
) o8 I. z' c$ o. d, e9 Z& Y5 ?. x% O</head>
! J' _& ?* w- x6 T$ L<body>
; Y* @) }2 K* a, _" c! B<div id="pic"> & r6 h2 R9 y- N& C
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> & }% W# D0 L9 O9 t
</div>
8 @3 K9 j0 Q1 {$ d0 q& {8 a</body>
8 f2 a% Q! r j9 ^</html>
8 Q/ r9 [( H/ }6 E7 x; g0 J
4 W, Q3 |, e5 D, {) z: ~百分比适应:1 {# l/ ^, W, t* _3 b
以下是引用片段：' o3 r' j C: h8 B) Z/ {. b
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
, K, M+ n/ `! a& z5 C. j<html xmlns="http://www.w3.org/1999/xhtml";> 1 a- b5 X P- @) l D8 X+ p# p0 y6 N
<head> 4 c) S) l+ j, X7 U% c7 e c n( O% L
<meta http-equiv="Content-Type" c /> 2 F4 H4 }/ F, W9 @6 R
<title>css2.0 VS ie</title>
0 [9 D5 D5 i2 z' D7 ?8 A0 V' u k<style type="text/css"> 4 t8 i( H2 W5 O- D
<!--
( m8 }! N l& j8 d+ E+ @9 @body {
3 k" h) [! }7 M( N8 l" gfont-size: 12px; 4 j1 V) ^5 O; w. Z/ G& v$ J# x1 L$ U
text-align: center;
/ Q/ P% `6 d* M9 L/ h, pmargin: 0px; ; u5 W' h/ \* w& [. i- t% v# ]8 V
padding: 0px; 8 t P) z9 j+ _
}
5 Y o4 l8 `. V6 l#pic{ " s0 e7 ^+ U+ P" [
margin:0 auto; : v( Z3 k) F# K5 L! ^; p
width:800px; 5 _3 k0 T3 a0 V: R9 {
padding:0; # ]0 o9 v6 x0 n& G
border:1px solid #333; 9 A0 w0 k( ?# M6 n1 Q* b/ b1 R
} 3 L: L( ~* A6 y# [
#pic img{
' g7 B( q' e* P4 T max-width:780px; : M; x. `" g9 e+ B* u! O+ g! c* a8 ?, H
width:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" );
( |7 z. z3 C- |! o sborder:1px dashed #000; ) C# K# ?# {1 x/ ?, g
}
4 R' a/ u! j( i! }8 ]- t--> 8 c3 n5 v/ o7 B% @+ i
</style> / J( X" s- h9 M# J
</head>
& z/ a5 M( |+ e. e2 d<body> 1 P% M g( t+ \( B
<div id="pic">
5 ~+ Z! c/ A f, d% S" k<img src=http://webclub.net.cn/images/Beijing2008/logo.gif>
; I# j, u) _# Z: g* ^/ |</div>
2 Y) w# ~! O$ ~# C- f9 b; L& _</body>
. m3 ]6 ]% e0 o</html> |
|
发表于 2007-12-8 14:55
| 