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

admin

dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。! v+ u! _" I& \* L# p5 E) z' ~

; ?3 e; j- O7 s0 S下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。
0 H+ n$ l7 P2 ]9 O5 g6 d- r$ R. U0 `6 j. M) o
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">/ s$ g4 V4 Y% Q3 R! i8 C$ M
  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>4 a1 [, M$ D8 L$ w
  <p>sdfasdfsafsadfsad<br>7 G* C: B; }& G- G$ e- O! J. P  c
  sdfdadasdfdsfasdfasdfasdf  </p>( c  j. n$ R4 g" }* u; d2 [
</div>
. P3 d0 [$ }  Z9 [& p2 h6 q! X
' ]7 e* b0 {9 h) ^+ _这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。
+ n( Q" z) V( S9 T! Q& a7 v- g0 b( K2 O+ b& v6 O, p
层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。7 ~: c; N7 N9 y
) [" m* o7 M5 H
试验证明，z轴的数值越大，这一层就越靠前。2 O: u6 P7 Z/ C
. d" a6 I7 ?8 D6 k* {' i
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">" }% G6 b, s  N
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
) I. B  x# J" K9 q9 j" B1 @  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
+ ^. w" S) M; D! `: X/ D4 C7 a</div>! |  \9 E" c) S! x/ y* D1 r

( ]0 q6 N6 h, E<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">. n) F6 M: m  ~& h* S9 K- ]
  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>
$ h9 h, n  n7 T% `8 l- B0 t. Q0 G' r  <p>ddddddddddddddddddddddddddddddd</p>- W$ G0 n; K$ e9 V
</div>
5 |* D5 }& X+ J* I" A$ D4 i, z+ Q9 i" V1 U8 g" W$ ]
body 的z-index应该默认是0