|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14321
- 金币
- 2446
- 威望
- 1647
- 贡献
- 1394
|
dreamweaver mx 中层(layer) 的概念
dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。, |, Z( r& Z/ I+ O0 |$ M9 W4 |
' b1 p( Z3 t# A* ]. k
下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。
$ A, K0 x# {# m5 {1 a, u8 N" v; ?& z1 J. b; A" I8 b; P. n: J
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">
7 K6 b% v: M' M( O- F# o <p><a href=../../blog.csdn.net/overmind>overmind</a></p>0 c9 L( U" E/ |! \" j' [( g1 M
<p>sdfasdfsafsadfsad<br>
( d3 g9 P( m1 u sdfdadasdfdsfasdfasdfasdf </p>0 q6 ^- W, i' T7 P/ U
</div>& k3 l9 D! p* o* _2 T* K- _$ Z6 ?) S
2 p2 o8 X3 ~7 w9 {1 C这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。 T s6 V) X( ]/ U8 S
( C) I- n' K6 } C5 _5 p! \# l层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。
6 X5 W, `0 d# s/ ] a# k/ ^
+ A$ P1 M! m X2 M& ^试验证明，z轴的数值越大，这一层就越靠前。
6 _# j' Q; v2 ^3 K
! Y3 L: Q3 u3 \" m/ z0 H<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">
! Y/ S% F! [" A4 X! j$ U. `/ Z <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>+ o3 m' q: y8 N, `$ \
<p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
4 |! C1 X/ Q5 a8 }. @3 _</div> L6 Q; E, t+ K0 g% |: e! R7 k! V
$ w& X5 B6 a1 b( j<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">
3 }2 u8 F8 l, D( k; B, Y( a3 n <p>ccccccccccccccccccccccccccccccccccccccccccc</p>) q E* l9 t1 ]3 p; S
<p>ddddddddddddddddddddddddddddddd</p>
" G: l9 I( V- M</div>
$ [( q( A1 G8 d- b1 Y( p' \2 T9 x/ I4 R( n! f7 y- i. t
body 的z-index应该默认是0 |
|
发表于 2007-12-24 17:35
| 