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

admin

dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。/ ?! c1 c% A/ S* p% c1 ^8 P
- O( _/ `1 |0 k/ J6 v5 Q( u
下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。4 b4 j2 Y& ~7 T3 t& E
1 c4 p: ~* V& t8 a" }
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">  ?3 ]6 s' N  ~% g- X
  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>$ h. l* Z" y" w/ X! j
  <p>sdfasdfsafsadfsad<br>5 r$ ^/ o8 S3 L! i, V1 k, f5 D
  sdfdadasdfdsfasdfasdfasdf  </p>/ y4 |# D" o+ [- W% I8 _. |; N
</div>
1 c& k) f" n+ `# m+ B( i  z- [5 d( k6 m1 P
这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。+ u/ Y: {' B3 F, [
* A& \& [' W( f  u1 c4 T( r
层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。
1 x) b# z7 ~7 m& w: `+ X" W
/ _( z' F8 v0 ~0 x( o/ E试验证明，z轴的数值越大，这一层就越靠前。: A/ C" A% ?7 T
# Z/ O% T; |8 a! K+ Q- v6 e- x; O5 G
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">
, j, t  s' ^  t, {; k) m6 _& K  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>( l7 i$ S2 j% ?$ X# h0 E" H# z
  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p># X. d7 p2 Z$ q* w. T1 F+ F3 G+ `
</div>6 E. [) i1 z6 {

* }+ z; d% z' t$ T, Y5 a. V: H& \) c: z$ @<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">
8 W( m( o2 A4 \2 t7 d  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>
; m* y. N# G5 }6 u  <p>ddddddddddddddddddddddddddddddd</p>
5 U( ^) p3 K8 f- D2 ^</div>
3 Z2 {0 c5 ]7 a: F& i2 D/ j1 H) R+ A1 d  y8 h0 t! c2 z
body 的z-index应该默认是0