|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14397
- 金币
- 2484
- 威望
- 1647
- 贡献
- 1432
|
以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。5 L" V! L0 P. c) R, w* U% P
关键在于：max-width:780px;以及下面那行。
! c# v0 Q2 v" v固定像素适应:
$ W4 \# {$ \/ @* k+ T( e& {# E% A% ?9 c, X4 T$ s- g
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% i3 A$ n4 O, K4 m! o<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
) N. D" y* `' \! L8 x<html xmlns="http://www.w3.org/1999/xhtml";>
7 J j. ?5 q' E6 S<head> ! P& a" y) L' `8 [
<meta http-equiv="Content-Type" c /> - u4 G' a$ R! w! v) _
<title>css2.0 VS ie</title>
& b0 J+ G3 F/ t1 ~* H8 M7 a<style type="text/css"> ' f; o0 b2 w9 v8 K, p/ p
<!--
G. L- \ V$ ]$ @# Wbody { ; B4 h# h9 `4 Z1 L1 ~. K, ^8 z
font-size: 12px; , E3 `; ~1 c/ ~4 Y! O! s( |
text-align: center; 4 y% U. b- f V( ]1 z, e
margin: 0px;
. T9 w1 K5 n' j L' xpadding: 0px;
9 w$ A K0 F; t% [* W% q} $ u0 M$ B6 X- F5 k% I8 r
#pic{ 6 F# {, p- w$ G3 q5 `
margin:0 auto;
' Y6 a" k0 ~; Q H8 A width:800px; 0 Q0 K) H% u6 e
padding:0;
, v( X$ R) S1 Z$ S9 C' t: e border:1px solid #333;
% I' `4 l# |& u: q } $ M9 ?9 e3 D P) Z' |0 Q o
#pic img{ 3 U: P; I# `, |' p, S
max-width:780px;
! \. J6 w: E/ v/ s$ I5 qwidth:expression(document.body.clientWidth > 780? "780px": "auto" );
) H# p. x$ }; z9 E: w T+ B. uborder:1px dashed #000; 3 `0 T7 V* c' m* N
}
, k6 @- o: w) ?7 a& a/ [--> 5 i5 l% }# y! f7 s
</style> ! P. M9 k+ r1 v+ |* W% y
</head>
5 e! r. P* X# V# U" V( b<body> % p7 O8 I& v v/ l: g: U" ^
<div id="pic">
3 G p3 I- x1 J2 S4 Z<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> : N& i5 A6 f( l$ B) e
</div> 2 m% s" \- L1 M6 ]
</body> ' q6 |; Z( S3 L! H# k
</html> & w6 c' a9 P: y! ?
( O! k% j) C; u; r5 }; o百分比适应:" w" O6 }# w9 h% W% i
以下是引用片段：' c5 Y% m1 E6 L% I* a
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
* x; w% r$ m& _% ]<html xmlns="http://www.w3.org/1999/xhtml";>
. M; l: I4 G- E, A<head> * a9 B3 a3 O( i* Y, L
<meta http-equiv="Content-Type" c />
9 u5 V; c8 U- M5 K<title>css2.0 VS ie</title>
: s) D6 F! X6 a' M<style type="text/css">
: t- E y `- S- {, o0 ? N4 c8 c<!--
W+ ?. n0 ] c- qbody {
; }+ p7 o' s+ t- L/ ^$ H) K3 X$ b; afont-size: 12px; 1 p; G) B( L0 B# ?) d
text-align: center; 6 y* d5 y8 Y, D8 ~$ i
margin: 0px;
" l% i8 S6 i+ r9 }padding: 0px; + X" m' v! o" I, \& M
} 7 W- e1 [* ~. a9 X7 x( G
#pic{ + i: e6 M5 P9 @& i2 i6 s$ i
margin:0 auto;
$ U$ S$ l; `* N7 a9 | width:800px; 3 _% c0 b! d% R9 v7 \ s# D2 k. G
padding:0;
/ _# \. K2 i: G7 { border:1px solid #333; 1 a6 T7 f7 ?2 Z d
} 3 S' i4 r% a# q8 E1 T, }
#pic img{ . V, N+ Z7 Y/ V) t
max-width:780px;
$ h; U# t' w+ G/ }; F2 dwidth:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" ); 6 z, g' a) @2 r6 z
border:1px dashed #000;
# A( [6 z+ C2 e' a( i}
, v/ C& P; [2 ~1 z) b8 q) D/ b0 X) {-->
1 {3 s5 m! Y8 c8 Y9 o( M</style>
$ R6 c% a, m( H: E* z+ O9 t</head> : r2 Y+ e" b) o
<body>
8 D4 P1 i; K% L) H<div id="pic">
/ V2 Q' n9 @* U/ R0 y, F<img src=http://webclub.net.cn/images/Beijing2008/logo.gif>
' E& O/ j; F- `</div>
# T( |1 \7 C* ? v5 r' B) ]</body>
& n2 F5 y) u- }# Z: E</html> |
|
发表于 2007-12-8 14:55
| 