分享
 
 
 

阿蒙建站故事之二——表格的妙用

王朝other·作者佚名  2006-11-24
窄屏简体版  字體: |||超大  

自从鸣涧上次给阿蒙卖了一个关子后,家里的电话总是响个不停,阿蒙按照上次鸣涧所说的方法制作出来的主页,总是感觉没有别人的好,版面格式编排设计也不满意,心里很不平衡。打了一百多个电话后,鸣涧终于不耐烦了,“好了,好了,我求求你千万别打电话了。在网页制作过程中,表格的应用是非常广泛的,在表格中组织和编排文本图形会更加灵活,可以制作别具一格的网页作品,我现在就告诉你如何使用表格吧。”

还别说,阿蒙一边听着电话那边鸣涧说,一边在电脑上操作,就基本掌握表格使用了,“哈哈,原来如此简单”。放下电话后,阿蒙决定自己再温习一下,仔细琢磨琢磨如何在Dreamweaver中使用表格。

插入第一个表格

我们要设计的网页的布局是,在页面最上方放置Logo和Banner广告条,中间的部分为栏目导航,下方为网页正文。单击“对象面板”中的插入表格图标,弹出“Insert Table”对话框(如图1)。设置Rows(行数)为“1”,Columns(列数)为“2”,表格Width(宽度)为“75Percent”, Border(表格线宽度)为“0”,完成后单击“OK”按钮。

dnet.com/school/web//2002/01/15/image/02801t01.jpg"

图1

表格的属性

将光标放置在表格的第一个单元格中,此时在状态栏左侧的标签选择器处会显示“{body}{table}{tr}{td}”,如果点击“table”则选择整个表格,“tr”选中当前行,“td”选中单元格,现在“td”被加粗显示,说明光标处在单元格内。单击一下{table},此时表格周围显示一圈黑线,表示表格被选中,四周同时有黑色方块,可以拖动来改变表格的大小。

选中表格后,打开“属性”,可以查看表格属性,如果要改变表格属性,可以在“属性”中进行相关的修改(如图2)。

dnet.com/school/web//2002/01/15/image/02801t02.jpg"

图2

插入图形

在第一个单元格内插入Logo图片,然后选中图片,发现图片宽度为205个像素,然后调整此单元格宽度也为205像素,这样单元格刚好可以容纳刚才插入的图形。完成后,再次选中图片,在“属性”中设置图形“Border”值为“1”。同样道理将Banner图形插入第二个单元格,同时选择第二个单元格,并在“属性”面板中单击“居中对齐”方式,使Banner图形居中显示。

制作栏目导航

打算设计栏目为5个,所以插入一个1行5列的表格,此时设置表格“boder”值为1,“Cell Spacing(单元格间距)”为“0”。选中插入的表格,在“属性”面板中设置表格高度(H)为“30 Pixels”(如图3)。

dnet.com/school/web//2002/01/15/image/02801t03.jpg"

图3

制作立体导航

选中表格,在“属性”面板中设置“Cellspace”为“1”,设置“Bg Color(背景颜色)”值为“#000000”,“Brdr color”为“#FFFFFF”。接着单击状态栏“tr”,选中当前行,在“属性”面板中,设置“BG”为“#99CC99”,“Brdr”为“#FFFFFF”(如图4),这样就可以制作出一个带有立体效果的单航边框了。然后在表格中加入栏目名称,并使文字居中显示。

dnet.com/school/web//2002/01/15/image/02801t04.jpg"

图4

设计正文区

在正文区域插入一个3行2列的表格,然后选中第一行两个单元格,点击鼠标右键,执行“Table/Merge cell”命令合并两个单元格并设置其背景色(BG)为“#CCCC99”。接着调节第2、3行的列宽,并合并2行2列、3行2列,并将正文插入到合并后的表格中。再设定左侧1列BG值为“#009966”,同时还可以根据自己的需要插入新的表格,并设定相关的内容,这里就不多说了。

基本设计好了,阿蒙觉着自己的主页漂亮多了。于是赶紧向鸣涧报告战果,当然啦,还得告诉鸣涧下次可得快些去他那里,否则电话就别想消停^_^。

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有