  
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14247
- 金币
- 2414
- 威望
- 1647
- 贡献
- 1362
|
dreamweaver mx 中层(layer) 的概念
dreamweave 是一款好用的网页制作软件,网页也是平面设计,就像Photoshop,Fireworks一样,这就使我们的软件有了曾这样一种概念,就像上述软件中的图层的概念一样,在页面上一层一层的进行制作。但是这个限制比较大,所制作的东西都在一个矩形框里面。, U& ^0 k f0 ?" P
$ H1 f8 ]+ ]* W( ^
下面我们添加一个层,插入-〉布局对象-〉层,这样我们就添加了相应的一个层,让我们来看一下他的代码。
/ R: T$ z( R. ^; n& _/ e* x2 S! J7 l4 S7 q8 _( E4 R7 H. |1 t
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">
$ ]* W! i, _+ u* N1 n8 a <p><a href=../../blog.csdn.net/overmind>overmind</a></p>
C2 ]6 q6 M/ z% l <p>sdfasdfsafsadfsad<br>
9 y2 k- q0 |8 s; i; X. \ sdfdadasdfdsfasdfasdfasdf </p>
$ B C6 w4 E$ B: Y0 V3 _5 e Y</div>9 I6 z C6 P4 l# Y
! @; o0 r! R1 [! H/ Q) N8 j这就是一个层,设置了简单的位置和大小,z-index:1表示图层的z轴位置,通过访问id,可以用js来操作一个层的动作。4 A7 r3 P; Q; b
% r+ ]9 s6 Y0 h% T0 }% E! T层的默认颜色是透明的,如果改成background-color:#FFFFFF",那么层地下的东西就不可见了,都被白色挡住了。
, x3 w5 v* L, P8 {& X5 p0 }7 r) ^+ x3 e5 z* p3 T
试验证明,z轴的数值越大,这一层就越靠前。: M/ |+ V h: a% s) g
( V0 b: Q: _2 P X<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">' K% R$ _5 t+ [6 V5 E
<p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
$ Z0 x; _' \& [6 F0 ]2 w2 h, t <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>! P4 u0 v' m( h; Z6 i5 _
</div>
4 c: M% u! V1 G4 h5 Z6 c) `7 F
5 m! S+ H/ b- T* F<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">
S% i$ h5 ]( s, u. U <p>ccccccccccccccccccccccccccccccccccccccccccc</p>' i# ]( K- P' d: q' ^" L
<p>ddddddddddddddddddddddddddddddd</p>
* ?) g7 a' C( M- P% ?</div>0 s0 O, E3 H6 Y+ J* n) w
; d0 L* X0 i/ l
body 的z-index应该默认是0 |
|