|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14221
- 金币
- 2401
- 威望
- 1647
- 贡献
- 1349
|
以前的解决方法主要是利用js来实现，但用过的人都知道该办法有点繁琐。还有一种是在外部容器定义over-flow:hidden。但这种办法只会切割图片而不会自动适用。
- `7 n4 p" K8 [关键在于：max-width:780px;以及下面那行。- |" j' F' H0 N( n/ K a% F3 |
固定像素适应:7 L' s& X4 a( y3 V, g3 u9 w V
. l. {% D: m0 R; c0 P
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> 以下是引用片段：
9 H: v; f/ @% T% z+ \" a<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
9 F8 ]$ r4 C" N' Y$ l9 m0 e b<html xmlns="http://www.w3.org/1999/xhtml";> - I0 J; a& R- R y- L
<head> 4 i" C( }$ ^4 ^: i1 a
<meta http-equiv="Content-Type" c /> 9 D+ I- C* V: k* ^. A
<title>css2.0 VS ie</title> ) y! R/ {8 k2 h5 k$ @& ]: J2 c+ Q: W
<style type="text/css">
4 l. k! W% ^0 g. b<!--
4 R6 r1 q6 L- r% J4 \2 p( _$ g0 y2 dbody { % h# G- @0 G% L" k
font-size: 12px; ; H- x# l ^2 x8 V w5 z# a
text-align: center;
* {$ W6 ^8 x7 Z* _( o5 E$ tmargin: 0px; " r9 a3 y: y( h- [/ n
padding: 0px;
. Z3 p" O. A; R. V; B( h7 v$ B}
/ N5 J p) Q' ~% x" L* z#pic{ - F" S4 ~3 B. I$ v* Y7 E4 j+ e
margin:0 auto; ! M4 A! A1 f8 n+ |( V) f. W
width:800px;
6 U" b+ _8 L+ {; ~ padding:0; ) W# U# f0 }" E& _' {1 b+ z
border:1px solid #333;
; D8 v: `+ v, i, _9 G } & b/ o W/ ^0 {+ C Q U) o
#pic img{
# s$ ^. Z1 L7 r- `- R max-width:780px;
[% n& x0 E3 qwidth:expression(document.body.clientWidth > 780? "780px": "auto" ); 3 ?8 @! Z. N) J
border:1px dashed #000;
3 {/ b' a& `* T4 d- P- H7 t}
; k( c8 {- V d2 C+ E& E--> ( r8 V. @/ l9 [$ V
</style> + M. |7 l N- r0 D: \8 P
</head>
$ V) M3 x" M6 c<body> 7 J* m4 v7 I% z& d
<div id="pic">
( ]6 C4 C& ~$ Y, W3 w$ W<img src=http://webclub.net.cn/images/Beijing2008/logo.gif>
9 w+ m- @& x: c- b& j+ Q$ K R</div>
$ t' H; _+ w* I+ u9 t</body> . q3 c6 ~; q! {7 @; I5 \
</html>
* a7 v) {$ p, S9 a/ {
$ ]6 }0 V. ]# e: _7 E/ w) a百分比适应:5 A* ]8 F, N0 u) n1 ]3 P* O
以下是引用片段：
4 ]8 B/ V( {1 S0 P" p) j" _0 n, Q<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
8 o( z0 Q# ^0 k) g<html xmlns="http://www.w3.org/1999/xhtml";> * [: J. x" r) }: h+ K- [1 Y
<head> 2 F; {; ?. L/ v2 }' ^( q
<meta http-equiv="Content-Type" c />
" Y" }( @% A2 |, a' e# \; h<title>css2.0 VS ie</title>
. Q- O3 K. f, u) A<style type="text/css"> 6 `6 W& ]5 O! h
<!--
5 A O1 p2 @& `. Q7 gbody { 3 U, ^8 R; f+ k$ L* p
font-size: 12px; ' b3 e9 |8 l2 V, s& B" K# `9 t1 M
text-align: center;
4 l6 [( J* s5 n2 [$ {margin: 0px;
y1 E: M4 r% Y) N" Q8 y; J0 }padding: 0px;
3 h" h* l* k6 K( |) Y5 \( Z} Z/ G0 m5 b4 P7 r
#pic{
/ k$ q8 B% n/ E1 D/ f8 i8 R- C( o margin:0 auto;
I+ t- Z9 t' }4 N width:800px;
3 o+ `8 \2 p9 w* d4 O# l- q$ j padding:0; . t6 R- @% f6 P& D! p, J
border:1px solid #333;
3 r* S# }) A+ W# n' M }
# G# `5 z1 z& c* y* [. `#pic img{ `4 S: G/ s1 s4 M9 }9 @
max-width:780px; & R9 Q4 h0 u+ r1 j
width:expression(document.body.clientWidth>document.getElementById("pic").scrollWidth*9/10? "780px": "auto" );
n6 ~9 C3 d# B3 o" Vborder:1px dashed #000; * s- y4 L, G. b
}
5 s) Z. l; K- {-->
; l: h4 C1 }( a! W</style>
! g/ k! ~; t5 f8 b</head> . b0 }2 m) K8 K6 j& o+ @, k
<body> & O( E# E0 W2 F2 g1 N/ k% p0 Z7 e/ k/ g
<div id="pic">
t" U# X( o% D2 k8 G<img src=http://webclub.net.cn/images/Beijing2008/logo.gif> - I2 Z( m' b6 _1 B: j
</div>
$ L, D: P) H; d# n) R1 z</body>
' h3 T0 O% L1 H+ `) J r* G7 ~</html> |
|
发表于 2007-12-8 14:55
| 