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

admin

dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。3 j3 d) g* Z  Z( ^' u
) c& K) t1 o2 ]  H, ~) ]
下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。. ~1 F. v: d, \$ s/ x2 \. F
5 j4 \% E$ o* r- e2 e
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">
2 W  F5 I8 R2 I+ l$ _+ _; E/ n  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>! N0 l$ [% J# m
  <p>sdfasdfsafsadfsad<br>
7 E' j. f6 F4 r* D! g* O  sdfdadasdfdsfasdfasdfasdf  </p>
8 h  f4 }8 V) s: J2 c1 @/ @</div>: {* _8 ], E) e% Y; f! t

" \7 X' F. K% T! s1 @这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。
( m! L1 j' l: l) F' O1 ~0 Q  Q( L( q+ S0 l( z1 ]
层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。
: C( Q* c( }6 [& f+ l: E0 {5 _& T* ?: `9 K: T9 @- V0 J
试验证明，z轴的数值越大，这一层就越靠前。
( G2 c8 i- B1 F7 T7 H  A: x
8 j$ A" q9 ?9 t4 D! ~/ @* h. s* l<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">
  B6 {* z: z& Q/ J  w# x+ ?0 ?  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>0 @6 B2 p# N% n6 o
  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
5 ~$ l( x& O% G: o6 b* u, |. k</div>
' m# a1 I  u6 G3 Y% N9 k2 \6 c- t* c0 P+ q3 x  c
<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">) Q: D& I3 [1 U' B- F3 A" q+ b
  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>% U/ l9 |9 T7 N
  <p>ddddddddddddddddddddddddddddddd</p>
2 Q, A8 X$ }4 W" J</div>
5 D. Z4 L+ s8 |. t; [* H5 h0 J
" W5 P+ P8 q5 E' h. z! Ybody 的z-index应该默认是0