返回列表 发帖

dreamweaver mx 中层(layer) 的概念

dreamweave 是一款好用的网页制作软件,网页也是平面设计,就像Photoshop,Fireworks一样,这就使我们的软件有了曾这样一种概念,就像上述软件中的图层的概念一样,在页面上一层一层的进行制作。但是这个限制比较大,所制作的东西都在一个矩形框里面。5 q. Z$ o! ?, l
+ m% y6 |! r6 @$ x/ W, f
下面我们添加一个层,插入-〉布局对象-〉层,这样我们就添加了相应的一个层,让我们来看一下他的代码。
; z0 G0 k. z9 a+ ~) _% q( j1 ?2 z, I
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">
+ y9 J5 t2 T( ^. Y  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>
7 p' s2 F" B# X' I% s& b6 K( U  M# O  <p>sdfasdfsafsadfsad<br>3 ^8 W+ K& g8 [# [2 k  v% h0 |$ }
  sdfdadasdfdsfasdfasdfasdf  </p>5 e1 A4 a0 S; z* D9 r+ n  g) b
</div>0 V4 e6 }' N# m9 B! ]. \9 z

! Z: N' P! X9 c这就是一个层,设置了简单的位置和大小,z-index:1表示图层的z轴位置,通过访问id,可以用js来操作一个层的动作。' ?4 `0 T6 C# Q$ V3 R

, Q, ?0 o7 e( F层的默认颜色是透明的,如果改成background-color:#FFFFFF",那么层地下的东西就不可见了,都被白色挡住了。9 E: p0 U3 [' Q1 y9 x

9 O( d/ S) ~, s8 `# @( m试验证明,z轴的数值越大,这一层就越靠前。2 a# f7 U6 C% I8 O, j
5 w9 l4 j5 v. @$ P+ |( j
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">" ^5 t! H2 i- w3 S9 L6 c
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>  b" d' |9 X- f5 M  ], K, |% i  h
  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>5 |$ m7 i, _# D& d5 ?
</div>4 L! |. A1 w' X4 c4 s
) C6 ~) |  Y# Y' H/ P
<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">/ e8 M6 M$ N; A' l& v
  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>; s1 {" t: N, `) C$ k$ h0 A
  <p>ddddddddddddddddddddddddddddddd</p>) K/ o+ Q* Q- q# V) m
</div>- l5 v& y8 z' R1 d; {9 S% x0 I8 ~- j

! e0 \0 c3 B4 s  V, ^: R5 Z5 Mbody 的z-index应该默认是0

返回列表
【捌玖网络】已经运行: