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

admin

dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。3 j; f# g' }6 Z* v3 l- t& a: }, o+ F

/ R$ \4 V8 h& q' ?" b. M! L  A; C下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。6 U2 j; n4 H( S1 U
- L/ U# H% N4 v! H) \
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;"># K2 a9 O; u8 t) j0 a( }: f( j
  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>/ P7 w. ^) D% ?% i* p1 b7 J6 r" z
  <p>sdfasdfsafsadfsad<br>. \$ [9 b( r8 U( l& ^3 j! R
  sdfdadasdfdsfasdfasdfasdf  </p>) _4 @' I8 O/ u; ]8 G- P, s
</div>2 t. c* r" u4 f, H: ^

6 r, w. X$ E& D8 p这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。6 q9 ?% ?+ V  g; ?% z8 p; D

1 B/ L' o. Q6 R/ i8 X/ @5 m! u: j层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。7 |1 E+ L% b% W/ a  k
! B1 S# q2 H4 \3 y
试验证明，z轴的数值越大，这一层就越靠前。, p; r5 K3 K) D  c) O+ {2 h
% T) v3 Q( T* n% t) R
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">
- B+ d& _9 R$ u  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>2 @1 ~% B4 S  M! `
  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
* Q3 E% ^! S# m; Y$ W0 O) A</div>
" M" Z4 n# c9 U, q  L6 {  Y" O  p7 \( b9 r6 M1 w/ M
<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">1 \/ [: O  t6 v
  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>
. q$ X1 y  c3 R5 L6 W9 q; V  <p>ddddddddddddddddddddddddddddddd</p>% ?  f2 b/ Y0 v- T% B
</div>9 |5 N5 ^# R  F& V" G

) c+ n. j+ R6 L  Z1 F6 ~7 ^' ebody 的z-index应该默认是0