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

admin

dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。
/ m" w! C2 k; U3 i' N
- _  S+ P7 t+ X. {2 K% c, A5 ]下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。# i9 I! I4 u6 J  t+ B" L
" k0 Z0 L4 t% B( z- |7 h/ _* ]
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">) G! L2 o! e+ }8 ~/ G
  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>
8 w. C' w5 d: n: M) n) E0 ?  <p>sdfasdfsafsadfsad<br>1 _5 m6 ~1 R. H( M% l) e+ {& p8 ^
  sdfdadasdfdsfasdfasdfasdf  </p>
* ~) A0 ]! L, K' k% h</div>% G" d$ {: r. |. B, u; F, ]; T) T
+ u" k  s, F! B' K$ v1 z
这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。
: U! ]8 r/ {7 }5 k( y  |+ n9 K1 _$ k8 I$ O2 w8 t/ D
层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。2 V' g  `# f# L& j  e* o
4 i& Y# I. p& o" O$ F
试验证明，z轴的数值越大，这一层就越靠前。
2 o4 s; X$ [  X. s) Y4 x* O# `' o
0 f5 V+ a1 P# ]6 z  t<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">
( b& T1 P$ p4 f2 ^0 {$ k  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
- S7 @. j9 j+ c; {7 X  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
6 R$ b8 |( S2 B% C. x</div>
9 j4 Y$ h' ^% |# ~# D1 |# Q' `
; ]$ V3 g6 I& O6 P" G( ?<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">8 U% u" F- `  a9 T7 f4 I
  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>1 Z: F7 Y1 G6 {' u( A- T+ }6 Y
  <p>ddddddddddddddddddddddddddddddd</p>' i" `7 z- G6 R
</div>( a/ ]! f- ]' C/ m

: L$ x5 ?9 f) `. o2 Q6 y; F" u6 ebody 的z-index应该默认是0