|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14389
- 金币
- 2480
- 威望
- 1647
- 贡献
- 1428
|
以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。
8 x8 b& f$ ~# c- c, t) V关键在于：max-width:780px;以及下面那行。+ ^1 O, n0 |8 j( z$ W# I5 w! R
固定像素适应:0 U s" M3 B/ u
) X- e) t5 a. y$ o9 R+ c
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> 以下是引用片段：! G0 [1 P2 j- r$ H
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
' y' {# U# H# \# \/ b* K<html xmlns="http://www.w3.org/1999/xhtml";>
; G4 u: x" R! c8 O Y& R% y1 o% @: e. L<head>
) k6 O% B) X2 M3 c<meta http-equiv="Content-Type" c />
@" f- G8 g2 E3 e1 t2 ~<title>css2.0 VS ie</title>
4 x1 w8 d! ]. Y0 a6 L9 M* ] ?<style type="text/css">
) Y, G i( Y: `& ^% Q8 T% W- Z<!-- $ T3 D9 k- A+ M; c
body { ' ]+ K X, }) Y7 R( t
font-size: 12px; % p; q) _9 h' [" Z
text-align: center; z7 V; ^" A! j/ ~) n$ d: s
margin: 0px;
/ L1 r) m! q5 @$ H6 l( @- B# W9 O( Jpadding: 0px;
/ w- K% _0 f) E# p$ X. \}
# h O0 [; c3 v _ [% ~#pic{ ; R) ?# i! T, X# [/ ^2 B
margin:0 auto; ) `, Y8 |0 t, a3 M' k: B5 f7 ?4 s
width:800px; 8 a5 c& R2 ~" e% @8 {
padding:0; ( \. K! d: Y1 ~7 w1 Z9 Q( A/ s, b
border:1px solid #333; : E1 N1 v4 U9 {) S3 c7 W
} 9 l/ N" ~! H" ^4 q: l8 M
#pic img{
) K. s7 b% o- {8 t max-width:780px;
" R0 k2 N" v! A. J0 Owidth:expression(document.body.clientWidth > 780? "780px": "auto" );
" p$ K6 p1 w8 H- v2 C2 Cborder:1px dashed #000; 2 t' B0 ~ m( s4 f" a* H
}
3 ^) f0 M. a% l--> 3 R- T2 ~! |" R$ Z, w1 L$ Y( `
</style>
* a8 x q* i# |4 y1 r" Z+ X</head>
3 W w) _+ z6 e<body> ' @ b* }4 @& }& [1 K
<div id="pic">
% o# u7 ^ p! ^9 c. B6 u6 B<img src=http://webclub.net.cn/images/Beijing2008/logo.gif>
* x8 x' v9 N7 A ~+ V8 M& a</div> 3 g) s. y& q& U6 B) n* `) I7 U
</body> % s; T( j6 \% n
</html> / h' n6 ^7 H& ] _! H
$ V* F: u! |) ]# E% }. l百分比适应:0 ]% Z7 \8 _4 ~9 p+ N# v* q; H
以下是引用片段：! J& L" h) S8 t: d3 v0 o
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> & x( h5 K* u; {6 _/ p/ |
<html xmlns="http://www.w3.org/1999/xhtml";> - Y3 q5 E6 H- L M- S& ~
<head>
1 |, L4 m" x- w3 a( W2 h7 G$ }" P; H<meta http-equiv="Content-Type" c />
4 B$ H+ j+ p$ |2 O% X" k/ ~8 u<title>css2.0 VS ie</title> 1 x6 {: N! r g) @/ F; ~# h
<style type="text/css">
( ]/ Q% l- @# ^- {5 Y9 `; m1 O<!--
& u. D3 z0 k2 V* U" {, L+ M) Vbody {
/ E, F$ x: O( F' F1 Yfont-size: 12px; ; r5 D4 Z. ?: Y. m
text-align: center;
* v1 z# R3 j: X1 S2 cmargin: 0px; 8 d- ]2 K2 d! C2 E' t8 I
padding: 0px;
* F" j2 b m( Z) C8 d} ( _, S$ f, J$ a5 ~% C" \0 x
#pic{
: l& G; Y3 L) f. u2 g margin:0 auto;
; V5 T$ j0 o$ Z9 g+ v width:800px;
+ r$ [9 l2 g, S9 d6 k8 I" U padding:0;
2 J: J, s; g' I border:1px solid #333; ' o+ P2 W2 I% y1 v% m
} , ^. f' l7 {2 b& R
#pic img{ , p4 x6 j; m# y. x
max-width:780px;
% b0 \5 `$ Q$ R Wwidth:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" );
$ y2 B/ X: B, Y# Dborder:1px dashed #000;
+ _% K. [# K+ A8 j6 m' M}
# P2 t# I/ E3 s( ?--> ) B+ b! {( T* \6 e
</style>
; J$ c4 [/ X. K</head>
1 f3 J1 L! Y# t8 P B<body>
! z- j% U4 i4 g( U# h<div id="pic"> 6 p ?7 ~% O2 a J
<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> ! I& [5 B. N! _! c) c
</div> 9 j. R+ {6 Z4 D
</body>
, G M) p/ b8 ]6 C</html> |
|
发表于 2007-12-8 14:55
| 