返回列表 发帖

dreamweaver mx 中层(layer) 的概念

dreamweave 是一款好用的网页制作软件,网页也是平面设计,就像Photoshop,Fireworks一样,这就使我们的软件有了曾这样一种概念,就像上述软件中的图层的概念一样,在页面上一层一层的进行制作。但是这个限制比较大,所制作的东西都在一个矩形框里面。
3 }; k9 Z9 F2 a' W7 y
7 O) X# B; |( `+ C& A下面我们添加一个层,插入-〉布局对象-〉层,这样我们就添加了相应的一个层,让我们来看一下他的代码。1 c3 p  f6 E" H: J
2 N9 p( Y6 `2 A1 G
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">
0 M2 K0 P0 L% }$ A" f" i  <p><a href=../../blog.csdn.net/overmind>overmind</a></p>
8 u( E" O: k# v3 ~  ]: a) G; O  <p>sdfasdfsafsadfsad<br>
3 K# O! H. V, q  sdfdadasdfdsfasdfasdfasdf  </p>) g1 g5 Z- R% @- c* Y1 B$ ^* @7 ~
</div>0 Q6 e3 g. L( d) L  Q# U

# e, P9 s* S9 M8 b3 y3 k( R2 ]这就是一个层,设置了简单的位置和大小,z-index:1表示图层的z轴位置,通过访问id,可以用js来操作一个层的动作。
3 l' v$ T( H! Y5 @. e
  W% H3 G: |- l* L7 x: x3 p7 a层的默认颜色是透明的,如果改成background-color:#FFFFFF",那么层地下的东西就不可见了,都被白色挡住了。
/ T: Q; {% Y$ I0 j& K/ L# A4 T2 T# {$ D7 v$ o3 [  D" n
试验证明,z轴的数值越大,这一层就越靠前。8 ?" G" r: ^5 N% S/ v- \2 z" B# ]
$ c! k' n- v0 }% H- e( \
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">
0 u, @* h. Y' [- K0 J/ q  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
' z6 O( `9 y$ h3 u  <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
. f1 D. A+ G. e9 ~) t* f+ C1 m</div>7 I8 {9 b' a7 R. ~

- V' _) b9 R& S. o4 i% D# i<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">7 [" L1 ?9 b0 ^# K6 s
  <p>ccccccccccccccccccccccccccccccccccccccccccc</p>
% q" G$ O' O$ H: M  <p>ddddddddddddddddddddddddddddddd</p>
# ^" A; ~* @& ]  ~</div>
  u( T9 b8 S9 W) C' Q" y
2 m+ C* n& K: X2 U# nbody 的z-index应该默认是0

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