返回列表 发帖

dreamweaver mx 中层(layer) 的概念

dreamweave 是一款好用的网页制作软件,网页也是平面设计,就像Photoshop,Fireworks一样,这就使我们的软件有了曾这样一种概念,就像上述软件中的图层的概念一样,在页面上一层一层的进行制作。但是这个限制比较大,所制作的东西都在一个矩形框里面。  G0 n' \: o! R* |5 x
8 b* Y+ Q* h  x+ c" G0 g6 v
下面我们添加一个层,插入-〉布局对象-〉层,这样我们就添加了相应的一个层,让我们来看一下他的代码。$ h/ q5 k! A$ q3 a
0 A' l1 n' Y! o" u
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">& T7 a3 D# g) @. E) m: m5 q
  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>+ `) `5 v- k4 W, X  G7 p
  <p>sdfasdfsafsadfsad<br>3 T: K' Q7 ~& c
  sdfdadasdfdsfasdfasdfasdf  </p>
. i8 ~4 e) c) T2 p$ }$ v1 N; y6 B</div>' L5 E4 Q; D0 \0 i# {: G& f. b
$ d# x7 D8 v1 E5 r
这就是一个层,设置了简单的位置和大小,z-index:1表示图层的z轴位置,通过访问id,可以用js来操作一个层的动作。
% ?1 d: S$ J2 @0 O( L) j" a4 i% f0 D% V; f7 `' C
层的默认颜色是透明的,如果改成background-color:#FFFFFF",那么层地下的东西就不可见了,都被白色挡住了。9 p$ ?* O2 N* v( C
' q! e% d$ w' f0 v' r5 |
试验证明,z轴的数值越大,这一层就越靠前。
+ h# B- Z0 B% N- l' R* l3 M2 X8 I9 X( e, g* Q; ?) o
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">6 a, u( Q. Z# n0 w1 t% @
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>3 }4 L- P1 E3 H- H+ [1 p; ^  n
  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
  M3 M7 [( j8 s& w2 }5 Q</div>/ r$ ~+ O0 p6 w

3 I  ~1 d6 _0 u<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">
3 z# i* ~1 [7 r, j  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>
. F% z9 _3 i: J  <p>ddddddddddddddddddddddddddddddd</p>& V! C7 ~0 e; E( t8 i9 {
</div>
: j' n  f# L& M
& |" `! z( d9 c# H4 I6 Ebody 的z-index应该默认是0

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