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

admin

dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。
+ f% G0 g. |5 V. P1 D
. O' j# F( G; G. f) ^. h' q下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。
! Y$ j4 Y# `) I  C; S8 ]9 q! [; P. T
( A& I: n/ q" a8 {3 l9 f<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">
! l% \3 `- S% I+ s, _* [* ^5 m! ^  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>  @* d7 `0 g' m. }3 k. ^
  <p>sdfasdfsafsadfsad<br>
% O& v1 _. ?0 z, ^  sdfdadasdfdsfasdfasdfasdf  </p>: Y2 j4 ~# R' C# I
</div>" h& R2 E7 T( K( z, z) Z
& J& V5 Q& w# h
这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。# f( _* y. H$ w; [. x
1 ~- l6 j8 D8 _* u1 Q& e
层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。
, {" t& y# G; \, Q! M- G4 Y0 H5 a# ~. D9 \8 p- x8 c
试验证明，z轴的数值越大，这一层就越靠前。  y, `7 w2 s3 M% k8 {. I
& M/ \' P3 l- f& X* T: f8 R0 U
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">3 i$ G: i. y" Q: t* H8 B
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
3 K. o- J4 h" p6 h3 D9 P, t1 Z  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
* @4 x* [2 s  y; n</div>
! ~* _( A3 }& V) R1 J; B& R) m
* _. ?6 ?1 ^0 T  G" T<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">
1 V/ [- l& a# l/ Y' E  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>( x% t4 M3 G$ _, U/ n; E
  <p>ddddddddddddddddddddddddddddddd</p>$ X& d0 Q; R- k& @2 ~5 Q
</div>
. I- @: d& @! E* P, s3 O' \' f. j6 e0 Y/ P- \* o9 I- t. [
body 的z-index应该默认是0