发新话题
打印

Dreamweaver MX进阶教程(十)制作居中的网页

Dreamweaver MX进阶教程(十)制作居中的网页


本文介绍两种居中的网页,一种是页面居中,一种是页面上下左右居中。  
! F; ?. I) a3 A1 w) h0 W; I8 ~6 f% m) B) H7 w
页面居中的网页
# R" n: R8 N: w实现方法:设置body标签居中。  " W/ o8 @9 j, C, i, Q2 R

- m9 V" O3 h/ D3 t9 y9 D1.打开一个网页,在文档左下角的“标签选择器”上选择“body”标签。
) s+ }1 d6 ^/ p; i  Z% a" B/ m9 Y* v/ v' w! N2 N

- P" i3 F# e1 {7 U! V9 `6 {5 r
2.在“属性面板”上点击“居中对齐”。现在居中的页面就做好了,往里面填充内容就可以了。
1 K2 Q6 D6 y7 L; l* q# i  C; \+ s8 t! D9 u! r( u# c' G- D

( F8 F. c+ ^" a7 m
/ }- S- V% o: _$ f5 }+ D转换到代码视图,看看生成的代码,原来生成的是“
% z6 S( C7 U4 k7 p' \' Q, b: u/ o
) E- O4 O# g4 |( Q8 u) O( \+ z”。
2 c2 K' U& t" S$ t9 t* U# d, g' N6 Q( s. K- h

0 j' F, v; t& F/ D, r9 o ! L9 D2 n  e4 t0 q4 w, I
可以选择两种形式的居中代码。使用“div”标签是其中一种,另一种是使用“center”标签。打开“编辑”/“参数选择”菜单,在如下图的对话框中,选择居中使用的标签。1 m. U# g, E: t) M; F
+ |3 p* R0 Q" w% L& j0 W

  w- S- e8 b& D! b
( _7 D# Z! q) M+ S+ s! T: t7 ], j
  1 [( M* g! m* o1 y
7 H8 C. ^+ {% U; a
页面上下左右居中
) O  h+ V8 K1 B# y& N实现方法:在页面中,插入一个一行一列,宽高都为百分之百的表格,并且设置表格不显示,使表格所在的单元格,水平和垂直都居中,在单元格中放网页内容,可以是一个或者几个表格,例如插入一个768×430象素的表格,也可以直接放入内容,网页看起来就是上下左右都居中的。  
: |2 G2 P3 g  l; g+ u
1 t# G+ e  [% K! n+ b% L5 i1.打开文档,插入一个一行一列的表格,宽牙为100%,单元格填充,间距,边框都为0。
% A' l" H* p. I% L7 U; c
0 b8 Q0 s; s& X* E1 k) M) B& M& z( J6 J9 F

" V' p' I. U2 H& [2.在属性面板上,继续设置表格高度为100%,具体设置如下图。
: H' p9 ?4 {: N2 L; o
) [/ c& v3 q  M
) Q2 U: g+ @* [" |
9 E# Q0 O/ t0 Z" @; x" ]3.在文档左下角的“标签选择器”上选择“td”标签。) J" q8 f% Z% `; ]

( ~2 @( y% ?! s) C, t2 V; _. V5 s2 _- K( ~1 I' J' O% @

8 A* G- g6 c+ Q3 q0 c' _# a4.在属性面板上,设置“td”标签(单元格)水平“居中对齐”,垂直设置为“中间”。' p8 k1 r: F  h( w
$ s: b  n% c& R, t/ Y* B  R

! O) b" I' B$ d3 C3 p8 ? : G: O1 D& z, N% I
5.这个时候,上下左右居中的页面已经设置好了。接下来,在单元格中,插入表格或者内容就可以了。



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

TOP

发新话题