dreamweaver mx 中层(layer) 的概念 dw层, layer

admin

dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。
" Z0 v/ [6 f, |- H5 C/ j+ |
# D- T* \7 R# D4 k下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。; N- g$ [: {( H& c( Z  A

2 R0 ^* ^* |2 E<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">
0 \, `. d: \: D8 ~3 U; N% M; x+ g  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>
% h* D2 m- P( x; I3 k8 D( Y1 L/ S  <p>sdfasdfsafsadfsad<br>
9 T; B) Q" D* `! J  sdfdadasdfdsfasdfasdfasdf  </p>. ?$ i6 F& ]. s1 R
</div>; T- I% H4 v% a5 V# N& O! m; b) ^

- B$ p8 Y0 b* q/ K" x3 @这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。; P7 V, S- b8 E1 q: U( V
0 z( I- q: ?* S& m4 R: C
层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。
* j  X1 d, Z! Z5 \3 M3 h5 C3 Y1 ~5 Z% N% g9 i, X  b( T6 N. T. I
试验证明，z轴的数值越大，这一层就越靠前。
1 m7 D& W9 `4 T  y8 i* G* ]. o# t; F! s0 g) e3 I
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">- ^7 o2 P& i* x3 [' y! V# A
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
; }9 C# \  H& r2 @( U  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>3 C: W6 ?! i& t, Z& D% @0 t/ G2 k. O
</div>
; V, w0 \  I3 r0 p6 d
. K& [# E( z' q6 Y% l% H7 P3 L; {. A<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">
4 w) [# g/ \5 q' T, Q( m  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>
4 Q; h/ I# T7 W7 J% v0 [7 P  <p>ddddddddddddddddddddddddddddddd</p>
" ?: ?; d2 g! m& x) M/ v</div>
3 V' L6 z  S+ g. }* t
3 u! X0 D+ r) Kbody 的z-index应该默认是0