1.跟书操作后课堂交流
跟书操作P79—100,然后就以下问题进行交流
表格的组成
上台指认表格的各个组成部分
插入表格
在文档中插入表格
导入、导出表格数据
表格的格式
定义表格在页面中的位置(左齐/右齐/居中)
定义表格内元素在表格中的位置(水平方向:左齐/右齐/居中,垂直方向:靠上/靠下/居中)
定义行高和列宽:按像素、按百分比
表格美化:手工设置字体、字色、字号、底纹、背景,套用已有表格格式
排序表格
表格的编辑
合并单元格
拆分单元格
增删行或列
2.利用表格进行网页布局
常见页面布局
垂直三段式:结构简单、层次少、主题突出
头部30%:放LOGO、导航栏、广告 |
中部60%:放主体内容 |
底部10%:放网站联系方式、身份证明 |
注:表格的高度用像素法或百分比法皆可;头部和底部的高度用像素法;中部的高度可以缺省,让系统自适应。
T型布局:页面较多、层次清晰、每一页长度一屏左右
头部30%:放LOGO、主导航栏 | |
辅导航栏 | 中部60%:放主体内容 |
底部10%:放网站联系方式、身份证明 |
定天元:只在页面最显眼处放一个主题画面,点击相应的热点可以到达相应子页面
主题画面:可以是线路图、组织结构图、产品线分类图或仅仅是一张画 |
讨论:网站类型与页面布局的关系
1. 形象展示型:主要由文字、图片组成,页面布局宜采用 ?
2. 信息交流型:主要由文字、图片组成,点击目录页中的信息标题能打开相应内容,页面布局宜采用 ?
3. 交易型:主要由文字、图片、表单、程序组成,页面布局宜采用 ?
3.使用布局模式和布局表格
表格的3种模式
标准、扩展、布局,了解其特点和在不同模式下可做的操作
布局模式的实质
也是表格的一种,特点是单元格位置任意定,由DW生成相应表格。
如果说,标准表格的特点是“横平竖直”,跨行或跨列需使用合并或拆分单元格来实现的话,布局表格的特点就是“平面膏药随意贴,DW帮你做表格”,由DW帮你制作高度灵活的表格,用来进行页面排版。
一个布局表格就象是一块膏药,在膏药上你可以画大大小小的布局单元格,在布局单元格里可以放文字、图片等网页元素。同一块膏药(布局表格)中的元素可以一起移动。
布局表格的使用
先建立布局表格
再于布局表格中建立布局单元格
最后在布局单元格中插入网页所需的元素
注意:所有的布局单元格不能重叠,新的单元格只能在网页空白区域或未建布局单元格的区域方能建立
关于自动伸展列宽
在布局表格中使用自动伸展列宽的目的,是为了将该表格宽度设成屏幕窗口的一定百分比,如20%、30%等
默认情况下,DW将自动伸展布局表格中某列的宽度,以便表格与屏幕窗口屏幕等宽。在此情况下,不管布局表格中其它列的宽度原先定义成多少,都会被压缩到最小(仅能容纳已放入列中的元素)。为了不影响其它列的宽度,使用自动伸展列宽时一定要对其它列使用间隔图像。
实际工作中,我们更提倡直接在代码视图中定义表格及各列的宽度为一定的百分数,而不是使用自动伸展列宽和间隔图像。