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

admin

dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。
/ F$ q& z% h# J2 \! y
, n2 C: V( l, Q, V7 z9 @下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。! a" T# x4 \  i# s

+ k+ B1 v) {4 D& s7 t, s<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">3 y  ?9 _% F3 n# K0 {" {
  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>
7 o( c* U3 D3 p0 n! q# n2 a  <p>sdfasdfsafsadfsad<br>
! x) T0 Z1 |/ Z  sdfdadasdfdsfasdfasdfasdf  </p>' u  G: c7 w7 L$ z6 T3 n/ ?- ^$ c2 U% D
</div>5 F  @# C! X0 ~5 L1 H( o$ z7 t
& f: q  k& ^. Y
这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。
- Z! [3 M' A5 U6 Y; h# I/ n) H* }! F9 k
: w" D9 ?/ T9 {层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。- e* o: ]! @0 M1 T4 z$ Y! m

* q0 O% F. C; m试验证明，z轴的数值越大，这一层就越靠前。
  s$ J* l# \" A7 h  d5 Y- K6 V/ w- `3 J
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">) ?% z. S5 w0 Y; N. V2 @! Z( z
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>) t3 R' w% |: `: h& f7 Z- O
  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
! k6 w8 N- Q/ ~4 _, q</div>4 K+ L" w. |) x" b, s7 F" o. d

9 S9 x/ G5 p5 B+ J3 }. _% m<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">! a9 t6 @( Y! Y, Y" Y/ s
  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>- f$ I5 J+ M. E$ x+ H* q9 `: a
  <p>ddddddddddddddddddddddddddddddd</p>
6 ~4 M5 h+ W: w2 I. A! C* f+ C</div>' q7 ]  p' ?5 u0 `- S* U0 i- l. ^7 W
% r5 {5 E; O6 q  `' l# x* S
body 的z-index应该默认是0