发新话题
打印

Dreamweaver MX进阶教程(十一)使用“层”布局网页

Dreamweaver MX进阶教程(十一)使用“层”布局网页


“层”在Dreamweaver中指的是带有定位css样式的“div”或者“span”代码。* n9 g3 Z- w' z3 b; L
“层”的特点是使用方便,可以轻松的使用“层”来布局网页。4 D) z% `: O! K* w3 {7 c
在使用“层”布局页面的时候,需要使用参照对象,根据参照对象,描绘“层”,也需要精确掌握“层”的大小。下面介绍一个操作实例。
8 B$ m  U% G- g4 M7 n$ y3 M1.打开一个页面,打开“修改”/“页面属性”,在页面属性中,选择“跟踪图像”。# _# ?* b' B& z( t* K9 b
0 @+ x5 j# q- }$ [8 R. W
: {4 g# l2 I7 X5 t9 d
: G: y6 w. J6 X
这个跟踪图像将作为“层”布局网页的参照对象。
8 B1 W: z% k( n# O2 u, f$ e
9 N1 d+ a. D3 }3 F5 U' e+ m5 W1 A, h2 B# X2 k

/ Y) R# {' i% S/ I7 ^7 N2.选择“查看”“标尺”“显示”, 打开标尺。) e. J& t. e+ o" m( {, |" g

' A' A* \) A0 h
/ y% `( h# T' S* n& Z   M. [) A3 M" c6 H
3.选择“查看”“网格”“显示网格”。 % I! k: Z) A8 j- H

, N- M3 p; E( B' K) P* {
' |3 a- O0 }; L: \6 f) D# |$ S & _, l! ~! ~# K- u% C
4.在“网格设置”对话框中,选中“显示网格”和“靠齐到网格”。
9 C/ ^* }! {) W) C1 P
. }! I& N! P8 C& B' j6 U) }1 q: \7 R# c2 L$ F, _

& W" i, B/ V1 @5 R! C5.为了防止“层”重叠,需要打开“层”面板。选择“窗口”/“层”,打开层面板。& ]0 m% @- W) s( i+ h$ K$ v
8 }5 M( {' J( V( S' e

$ b& h4 v% C/ z) g( k6 G( d
; o7 O6 I* r+ [* M# R+ a6.在“层”面板中,选中“防止重叠”选项。
* G, b4 D' u" S) I; H' F, @7 [. O4 ?" Q9 Z/ l; A6 r

' z5 o& S8 @/ S5 r  w
" Z! q4 \3 t9 s/ C2 I3 c) i7.现在开始描绘层了。点击“插入”面板“常用”选项卡中的“描绘层”图标。如果要连续描绘多个“层”,按住ctrl键。* @* X# `" ^: H2 a
# g2 B$ ~8 A) [5 ?* `6 s

8 h. V, ~3 u: @1 k4 e" H8 ?
, e& V$ a* @$ W( \# R) q: b8.在文档中,参照“跟踪图像”,“标尺”,“网格”,按住ctrl键描绘层,描绘的层靠齐到网格,就可以精确控制层的大小。
1 g7 F8 V8 O8 J) P" Q7 Q7 \. z
# M2 Y$ {: V6 [7 Y) m; ?
   ; ]6 u/ `" ~8 n1 m; S+ [

, Z. h: U- }( u3 S) u7 f使用页面背景图像/ u. G2 _. }6 L' c4 v* J2 G
描绘层生成的页面,使用的是默认对齐,页面居左。为了适应大多数分辨率的显示器,“层”布局所占的页面大小,可以使用宽770象素×高600象素。可以选择一种恰当的背景颜色,或者一个小尺寸的图片作为背景,如果要选择单一图像作为页面的背景图像,可以选择宽1600象素×高1924象素的gif图片,这是一个粗略值了,在大多数分辨率下,都会感觉网页内容很充实。$ ^0 P' [" g5 u0 n/ A( @5 I  E
如果要使用单一的大图片作为页面背景图像,并且背景图像内容很多,就不需要再设置“跟踪图像”了。使用“层”布局也会更简单,只需要描绘出放置文字内容、表单、链接、图像的层就可以了。



点击图标进入精品网摘收藏 欢迎大家加入网络收藏夹

TOP

发新话题