  
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14247
- 金币
- 2414
- 威望
- 1647
- 贡献
- 1362
|
dreamweaver mx 中层(layer) 的概念
dreamweave 是一款好用的网页制作软件,网页也是平面设计,就像Photoshop,Fireworks一样,这就使我们的软件有了曾这样一种概念,就像上述软件中的图层的概念一样,在页面上一层一层的进行制作。但是这个限制比较大,所制作的东西都在一个矩形框里面。* K3 @' a* X H2 M6 d7 `4 H
5 p5 m) o& ?& S% V8 D
下面我们添加一个层,插入-〉布局对象-〉层,这样我们就添加了相应的一个层,让我们来看一下他的代码。
$ V# U0 @" i; ~$ O# I; E4 V. L3 u% E' _3 s6 [1 u4 w& p& b2 `* B1 ]
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">
/ Q2 g9 | W8 ?, B8 |% E <p><a href=../../blog.csdn.net/overmind>overmind</a></p>
: \9 `3 a, O; k* a <p>sdfasdfsafsadfsad<br>
" q+ l+ g$ I$ D; M: ] sdfdadasdfdsfasdfasdfasdf </p>1 |* y! i$ W) W" w
</div>
" n0 Z8 U/ D1 B6 z8 l
M8 t: _( U' o8 j( V这就是一个层,设置了简单的位置和大小,z-index:1表示图层的z轴位置,通过访问id,可以用js来操作一个层的动作。# N$ p+ l; E& V9 t1 J" w: o4 y; @
6 ]3 q5 `. H3 X, Q层的默认颜色是透明的,如果改成background-color:#FFFFFF",那么层地下的东西就不可见了,都被白色挡住了。
) p: t2 L- f- e. T
: s' }, F+ g8 p) h% i, Y, u试验证明,z轴的数值越大,这一层就越靠前。0 X7 F4 h5 t1 ~- B1 }/ o
- A# v" r9 G% g3 r
<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">7 ?: W( K& o6 E U8 T$ I0 f
<p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
% m4 z- X7 w2 ?- \ <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
7 e% ^8 m( L0 [) }</div>, J+ W# |9 X( a' d0 Z# x
( L( _8 f1 n( k
<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">3 l1 O- ?( {# c. Z. q; g' \
<p>ccccccccccccccccccccccccccccccccccccccccccc</p>0 ?1 s7 b8 z/ X! o, [ }3 Q
<p>ddddddddddddddddddddddddddddddd</p>+ F; d: ] E3 U9 F1 ] k
</div>+ R6 P' V0 O2 {7 g, }3 l
- y( P$ x% q6 |. q. L% y* g
body 的z-index应该默认是0 |
|