网页制作教程 第2版 教学课件 作者 王君学 项目三 网页布局与批量制作.ppt

《网页制作教程 第2版 教学课件 作者 王君学 项目三 网页布局与批量制作.ppt》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、学习网页布局技术，可以使网页页面布局更加合理、界面更加美观；学习网页批量制作技术，可以制作出具有相同外观的网页。本项目将介绍网页布局和批量制作的基本技术，包括表格、Div+CSS、库和模板等。项目三网页布局与批量制作学习目标掌握插入和设置表格的方法。掌握使用层、Div标签和时间轴的方法。掌握创建和设置CSS样式的方法。掌握创建库和模板的方法。任务一制作“翔翔文学”网页（一）预备知识──插入和设置表格（二）任务实施──制作“翔翔文学”网页（三）延伸阅读──表格的使用技巧编排“翔翔文学”网页，如图所示。通过本实例的制作，掌握插入和设置表格以及使用表格进行页面布局的基本方

2、法。（一）预备知识──插入和设置表格表格在网页中的用途非常广泛，它不仅可以有序地排列数据，还可以精确地定位网页元素。1.创建表格首先介绍插入表格和创建嵌套表格的方法。(1)插入表格将光标置于要插入表格的位置，然后选择以下任意一种方式打开【表格】对话框进行参数设置即可。•选择【插入】/【表格】命令。•在【插入】/【常用】工具栏中单击（表格）按钮。•在【插入】/【布局】工具栏中单击（表格）按钮。•按Ctrl+Alt+T组合键。（一）预备知识──插入和设置表格(2)创建嵌套表格嵌套表格是指在表格的单元格内再插入表格，其宽度受所在单元格的宽度限制。在进行网页布局时，常使用嵌

3、套表格来排版页面元素，此时，表格的边框粗细通常设置为“0”，如图所示是一个嵌套表格。（一）预备知识──插入和设置表格2.添加表格内容表格创建完成后，即可在表格中添加文本、图像等内容。在表格单元格中添加文本就如同在文档中操作一样，除了直接输入文本外，也可以从其他文档中复制文本，然后将其直接粘贴到表格内。随着文本的增多，表格也会自动增高。在单元格中添加图像时，如果单元格的尺寸小于所插入图像的尺寸，则插入图像后，单元格的尺寸将自动增高或者增宽。如图3-4所示是一个添加了文本、图像的表格。（一）预备知识──插入和设置表格3.编辑表格表格创建好了以后，有时会根据实际需要进行增

4、加行或列、删除行或列、合并单元格、拆分单元格等操作，下面进行简要介绍。(1)选择表格要对表格进行编辑，首先必须选定表格。因为表格包括行、列和单元格，所以选择表格的操作通常包括选择整个表格、选择行或列、选择单元格3个方面。①选择整个表格选择整个表格的方法主要有以下几种。•单击表格左上角或单击表格中任何一个单元格的边框线，如图所示。（一）预备知识──插入和设置表格•将光标置于表格内，选择【修改】/【表格】/【选择表格】命令，或在右键快捷菜单中选择【表格】/【选择表格】命令。•将光标移到预选择的表格内，表格上端或下端会弹出绿线的标志，单击绿线中的按钮，从弹出的下拉菜单中选

5、择【选择表格】命令，如图所示。•将光标移到预选择的表格内，单击文档窗口左下角相应的“

6、”标签选择行，如图所示。•将光标移到表格内，单击欲选择列的绿线标志中的按钮，从弹出的下拉菜单中选择【选择列】命令，如图所示。（一）预备知识──插入和设置表格③选择单元格选择单个单元格的方法有以下两种。•将光标置于单元格内，然后按住Ctrl键，单击单元格可以将其选择。•将光标置于单元格内，然后单击文档窗口左下角的