网页设计与制作 第3版 相万让 第4章

《网页设计与制作 第3版 相万让 第4章》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第4章网页设计与美化第4章网页设计与美化4.1制作框架网站4.2层与时间轴的应用4.3利用行为制作动态页面4.4制作表单页面4.1制作框架网站框架是一个比较早出现的HTML对象，框架的作用就是把浏览器窗口划分为若干个区域，每个区域可以分别显示不同的网页。使用框架可以非常方便的完成导航工作，而且各个框架之间决不存在干扰问题，所以在模板出现以前框架技术一直普遍应用于页面的导航，它可以使网站导航比较清晰。4.1制作框架网站使用框架建设网站的最大的特点是使网站风格能够保持统一。一个网站的众多网页最好都有相同的地方，来做到

2、风格统一。可以把这个相同的部分单独的制作一个页面，作为框架结构的各个子框架的内容给整个站点公用。通过这个方法达到了网站的风格的统一。4.1框架的基本操作创建框架集和框架选择框架和框架集保存框架和框架集设置框架集属性设置框架的背景色在框架中设置链接创建框架集和框架框架有两部分组成,即框架集和单个框架。框架集是在一个文档内定义一组框架结构的HTML网页，它定义了一个网页中的框架数目、每个框架的大小、载入每个框架的网页源和每个框架的其他属性等；单个框架指在网页中定义的一个区域，每个区域可以分别显示不同的网页。创建框架集

3、和创建框架是同步进行的。只要创建了框架就一定形成了框架集；同样，创建的框架集就一定具有框架。创建框架页面使用“新建文档”对话框使用菜单命令使用布局面板创建框架页面使用“新建文档”对话框使用菜单命令新建一个空白文档执行“插入”“HTML”“框架”命令，在弹出的子菜单中选择所需的选项使用布局面板创建框架页面以上方法既是创建框架集也是创建框架的。创建框架集创建自定义框架集，可以执行“查看”　　　“可视化助理”　　　“框架边框”选择框架和框架集在文档窗口的设计视图中，在选定了一个框架后，其边框被虚线环绕；在选定了一个框架

4、集后，该框架集内的框架的所有边框都被虚线环绕。选择框架①按住Alt键选择框架②使用框架面板选择框架选择框架集①单击框架的边框②单击“框架”面板中最外层的边框保存框架和框架集在浏览器中预览框架集前，必须保存框架集文件，以及要在框架中显示的所有文档。可以单独保存每个框架集文件和带框架的文档，也可以同时保存框架集文件和框架中出现的所有文档。保存框架集选择框架集之后，进行保存。只保存框架集的框架结构页面是不能完全显示的，还必须将每个框架文档进行保存。保存框架鼠标单击框架文档，进行框架页保存。保存框架集和框架执行“文件”，

5、“保存全部”，将整个框架集保存为index.html接着保存下面的各框架。设置框架属性选定具体框架，利用“属性”面板进行设置。设置框架集属性选定框架集后，利用“属性”面板进行设置。设置框架的背景色将光标置于要改变背景色的框架中执行“修改”　　　“页面属性”命令，打开“页面属性”对话框进行设置在框架中设置链接应用一个框架的一个主要目的是实现框架之间的链接。浮动框架4.2层与时间轴的应用层是一种HTML元素，可以将它定位到网页的任意位置。层可以包含文字、图像或其他任何可在H

6、TML文档正文中放入的内容。层最主要的特性是它可以悬浮在网页内容之上。换句话说，可以在网页上任意改变层的位置，实现对层的精确定位。正是由于层的这种特性，才利用层实现对网页中的内容进行精确定位。层可以被显示或隐藏，通过程序在网页中控制层的显示或隐藏，实现层上内容的动态交替显示，实现一些特殊的显示效果。层还可以被重叠，因此可以在网页中实现内容的重叠效果。层的基本操作在Dreamweaver中可以直接在网页中插入层。通过“层”面板可以管理文档中的层。使用“层”面板可防止重叠，更改层的可见性，将层嵌套或层叠，以及选择一个

7、或多个层。执行“窗口”“层”命令，或按F2键，打开“层”面板，可以看到所有的层都显示在其中。要更改层的排列次序，可通过修改层的Z值来实现。单击Z列中的数字，为所选层输入新的Z值，即可改变层的排列顺序。层的基本操作插入层设置层的属性选择层调整层的大小移动层插入层将光标置于要插入层的位置，执行“插入”“布局对象”“层”命令设置层的属性选择一个层，执行“窗口”“属性”命令，打开“属性”面板来更改层的属性。选择层选择层的三种方法是：①将光标移动至需选择的层边框，光标变为，单击鼠标左键即可选择该层。②在层的内部单击属性，显

8、示层的选择柄，单击选择柄，即可选择层，如果选择柄不可见，可在该层中的任意位置单击以显示该选择柄。③打开“层”面板，在“层”面板中选择层名称，即可选择该层。按shift可以选择多个层。调整层的大小单击层的边框调整层的大小使用属性面板调整层的大小4.3利用行为制作动态页面一般说来，动态网页是通过JavaScript或基于JavaScript的DHTML代码来实现的。包含Jav