返回列表 发帖

dreamweaver mx 中层(layer) 的概念

dreamweave 是一款好用的网页制作软件,网页也是平面设计,就像Photoshop,Fireworks一样,这就使我们的软件有了曾这样一种概念,就像上述软件中的图层的概念一样,在页面上一层一层的进行制作。但是这个限制比较大,所制作的东西都在一个矩形框里面。' w3 c& g0 r/ X$ Q5 F6 V
- W- l/ ^4 c- k) D4 p2 E
下面我们添加一个层,插入-〉布局对象-〉层,这样我们就添加了相应的一个层,让我们来看一下他的代码。
/ a4 S' ?  d; k6 Q. I; O
  O+ W4 f3 B- W& K) D. I<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">' C3 X* r, l/ e& l
  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>
& A8 B6 V2 \* j4 p, ]) G4 D  <p>sdfasdfsafsadfsad<br>+ J0 s* Q% R. P1 d* j
  sdfdadasdfdsfasdfasdfasdf  </p>
% Z& o2 }( {+ n# Y</div>
5 Z# X6 {, Y% q- t/ Z
8 L* T2 ]4 M/ [/ e2 y* w( H这就是一个层,设置了简单的位置和大小,z-index:1表示图层的z轴位置,通过访问id,可以用js来操作一个层的动作。
, q+ I. ~& X/ ~" i6 {- i* }) ?9 `3 G7 e: G7 a+ @% I
层的默认颜色是透明的,如果改成background-color:#FFFFFF",那么层地下的东西就不可见了,都被白色挡住了。
4 q9 h; d8 A1 R9 t& M7 W) L) Q" O; Q8 F. q. t( u; Y1 o" O+ b
试验证明,z轴的数值越大,这一层就越靠前。
0 t* K, t. Z0 H0 c; y0 u
6 a3 t/ c5 @$ S" ?2 K2 e- j<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">( h& Y- O3 L5 r/ P
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>* H" _9 S# ^' }
  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
  J8 L+ W) Y- v: B* q1 R</div>
0 d) `" u" r, a1 O% W! c2 H% V
/ d. D+ c' `. y<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">
, F- G! N. I& X: f% q  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>
4 Y, ~% _  n$ A' r. g  <p>ddddddddddddddddddddddddddddddd</p>9 E1 g3 h! w0 z8 A
</div>- o4 }, m& I" d0 ]( j+ n

4 D5 Q! l9 H( d& h, Nbody 的z-index应该默认是0

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