|
 
- UID
- 1
- 帖子
- 738
- 精华
- 28
- 积分
- 14171
- 金币
- 2376
- 威望
- 1647
- 贡献
- 1324
|
dreamweaver mx 中层(layer) 的概念
dreamweave 是一款好用的网页制作软件，网页也是平面设计，就像Photoshop,Fireworks一样，这就使我们的软件有了曾这样一种概念，就像上述软件中的图层的概念一样，在页面上一层一层的进行制作。但是这个限制比较大，所制作的东西都在一个矩形框里面。' r. v, I) v7 L) h+ H6 {
. b$ D; L" V6 T
下面我们添加一个层，插入-〉布局对象-〉层，这样我们就添加了相应的一个层，让我们来看一下他的代码。
$ R, f; S" u8 b8 ?& }! r
- s' i+ @* D/ w, t( X$ R( |; k* J$ z8 \<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 59px; top: 51px;">/ a# ~6 \9 L* ^5 @
<p><a href=../../blog.csdn.net/overmind>overmind</a></p>
9 S5 q" z! E7 ^& a, F2 c' E* |% g <p>sdfasdfsafsadfsad<br>
5 V; n" U; D# r0 K( @* P% \# G sdfdadasdfdsfasdfasdfasdf </p>
0 w2 h0 G( O) a- H% y</div>& `1 U/ s" l7 q. o% R# m/ u1 |
) i8 G: Z/ q- _8 M4 Z Y这就是一个层，设置了简单的位置和大小，z-index:1表示图层的z轴位置，通过访问id,可以用js来操作一个层的动作。6 Y+ b% P) s; D
9 P8 a$ b( M3 f" j C' R层的默认颜色是透明的，如果改成background-color:#FFFFFF"，那么层地下的东西就不可见了，都被白色挡住了。
# c4 U% x/ l/ m, G7 V; j: {+ E. A8 C5 v' @
试验证明，z轴的数值越大，这一层就越靠前。
2 a, K p" ?9 _7 H1 H: P0 @
$ ?( V/ q2 w. A! z<div id="Layer1" style="position:absolute; width:250px; height:181px; z-index:1; left: 165px; top: 124px; background-color:#FFFFFF">. f8 o1 V& C3 I0 S2 T7 T5 l; T
<p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
% l1 o6 u7 b* Q( c$ f <p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
, N7 B* A6 d: B4 T; i</div>
8 e, l% s$ I! l2 z- {5 b* a1 m
8 u0 y {' k$ Y9 B<div id="Layer2" style="position:absolute; width:250px; height:181px; z-index:2; left: 236px; top: 142px; background-color:#FFFFFF">
% ~4 p" `3 G; l$ ^/ o <p>ccccccccccccccccccccccccccccccccccccccccccc</p>4 ?4 a* i, t& O; o; W& X
<p>ddddddddddddddddddddddddddddddd</p>
$ B: M% K: X1 k</div> C5 V& [$ p: Y# u* V
5 d- M6 n7 S3 F# g9 ~. L8 K8 |
body 的z-index应该默认是0 |
|
发表于 2007-12-24 17:35
| 