返回列表 发帖

dreamweaver mx 中层(layer) 的概念

dreamweave 是一款好用的网页制作软件,网页也是平面设计,就像Photoshop,Fireworks一样,这就使我们的软件有了曾这样一种概念,就像上述软件中的图层的概念一样,在页面上一层一层的进行制作。但是这个限制比较大,所制作的东西都在一个矩形框里面。
: |6 b! G! T1 q4 K9 l
( j. ?, C4 `1 |# ?# B" x+ r. G下面我们添加一个层,插入-〉布局对象-〉层,这样我们就添加了相应的一个层,让我们来看一下他的代码。8 Z* q, J' l7 O6 j+ Y6 d

8 I5 R- k' a* g1 A, C! T<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">2 ?# E6 _. r  Z$ g# H. G
  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>, o+ @- e! X! d5 [9 [) m9 g/ J
  <p>sdfasdfsafsadfsad<br>
# T  _8 D, `* ?  s9 r: Y  sdfdadasdfdsfasdfasdfasdf  </p>
" }: d  R6 a7 j# [. z</div>
5 a' Y# \" ~- R" b7 Q& K# p
+ r' _7 c( w1 n这就是一个层,设置了简单的位置和大小,z-index:1表示图层的z轴位置,通过访问id,可以用js来操作一个层的动作。
: F+ L/ E. F5 P: S5 t/ ^% M  X8 O/ W  ~' T. `0 G
层的默认颜色是透明的,如果改成background-color:#FFFFFF",那么层地下的东西就不可见了,都被白色挡住了。
) C7 j+ a; }+ t* O0 n% F4 ^3 y
( f) x+ n! ]2 J试验证明,z轴的数值越大,这一层就越靠前。0 o7 N/ S$ G; g$ g! O" L2 Y* c* N

. u; t8 ~: L. S# z7 U<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">
6 T, ?3 f) F1 g  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
3 }/ e# `! y% J+ F& m' w  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>1 b+ S& H5 K8 q) B
</div>$ l) \' q3 u4 a  X! w

4 ^5 Z9 \5 G$ e. Z+ |/ U7 R# _. I<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">
3 Q$ G( A. J% v  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>: n; [2 ^6 {6 r! W& m
  <p>ddddddddddddddddddddddddddddddd</p>3 @% P9 Z( n9 ?. b
</div>" _) Z5 k  ]1 u) C& W  d
9 h" u+ J5 g) w" l* w2 \
body 的z-index应该默认是0

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