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

admin

dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。. M# k" L. f" t/ P0 i# e- K4 `/ X6 m, ^

, _* J) s6 S7 n9 M下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。" }+ z3 N9 G) T' b% s

% Q: `) N9 \$ e/ u. e" b6 g8 g0 O<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">
/ @: A- ^/ |7 s0 Q# E  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>
5 M; d$ j. J8 m8 x% H  <p>sdfasdfsafsadfsad<br>
! z" E; c' ?: d) q' ~) w$ v  sdfdadasdfdsfasdfasdfasdf  </p>: E! Y# ]4 T& x, C% K, x1 B- j
</div>/ Z1 O5 h6 P4 L& k+ M# p: x! v, z
, _/ L  B3 P' |
这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。3 A, s8 Y7 }/ x6 Z: w

$ e( a9 d8 @, D8 w0 t  v层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。  G9 n4 Q. r5 D$ A' c

9 B" u! k2 A- m试验证明，z轴的数值越大，这一层就越靠前。
5 T2 s' i; u6 m' X  _+ |9 ?* y1 }$ `2 L. G$ }2 J
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">0 |& s. ]3 F' d5 M$ I1 e" u
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
4 S4 \( c2 \" Z  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>5 N' i1 R/ k4 g$ W2 E
</div>
& f( @, L0 F; M  s7 n( O9 d. V. n3 }3 O
<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">
( l$ o# m! ?- u" Q$ v& o; l  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>! e1 S! K$ k9 m
  <p>ddddddddddddddddddddddddddddddd</p>
4 M2 k6 h" E) I, p- A</div>
! L$ M, n/ ~7 K3 z7 T% s9 c. T
& T3 B7 w8 E  C7 Z. X7 ?body 的z-index应该默认是0