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

admin

dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。+ g$ h; W2 R& R9 G3 |9 n+ s
  D3 X; |3 S, }0 ^
下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。) t# ~1 g+ i8 r* y" R7 O; |
. Q" U7 V* x( s, W- O' V% g* a
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">9 n8 G8 g$ K! |+ k, Z) T. K
  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>) w5 ^9 X2 U8 ~  R' [( c1 L4 [
  <p>sdfasdfsafsadfsad<br>
* h  |0 S4 q/ ^1 G9 ^  sdfdadasdfdsfasdfasdfasdf  </p>
% b- g. S- a- W1 K. o% `- Q</div>5 N1 F$ `, E% |! [( {: Q

1 M& r0 d5 A+ e2 w这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。" S7 P& Q3 g9 J6 ]1 R
2 U# M. K# H& K5 _. p0 e
层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。1 z7 H5 _3 u5 j  s- c" K( }
; i8 G$ `6 _. D$ N0 z9 {
试验证明，z轴的数值越大，这一层就越靠前。
9 Z% X* |* C% C4 V
. P/ I6 r9 [6 H<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">: J$ h, X; y( W: f1 D
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
2 z6 }' Y* M9 k% f, g; H% @" l! W  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
5 v2 }! q' Q# m" |9 @5 y+ D</div>
! ?1 @' K+ x: T( s3 R# U8 \# P9 R  Q' P* y1 u& U& {- U: F
<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">" B' i1 `4 Z0 x, C6 L8 r
  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>
/ e7 M. j/ L- ~+ D& E  <p>ddddddddddddddddddddddddddddddd</p>8 q  d! G" }& |  o1 [5 C
</div>
1 Q6 u9 B. L9 f2 a1 Z1 |: }' L2 G% Z7 J# u( |6 x% I& X% p7 B
body 的z-index应该默认是0