APP下载

浅谈框架网页的学习

2019-02-03李仙花

现代职业教育·职业培训 2019年12期
关键词:字符框架结构矩形

李仙花

[摘           要]  中职学生在初学框架网页时,往往效率不高。通常表现为框架结构建立不正确,框架网页文件保存混乱,框架代码看不懂。从手绘框架结构图建立框架网页、根据关键字符命名并保存框架网页、利用框架面板辨析框架代码这三方面来论述框架网页的学习。

[关    键   词]  手绘框架图;关键字符;框架面板

[中图分类号]  G712             [文献标志码]  A                    [文章编号]  2096-0603(2019)36-0208-02

根据省对口高考招生考试计算机应用类专业考试大纲要求,学生不仅要掌握框架网页的设计,还要掌握java代码在框架网页中进行综合运用。而学生在初学框架网页时存在如下问题:创建框架网页的结构是混乱的、框架网页的保存是混乱的、无法辨析框架代码。从多年的教学来看,我觉得在初学框架网页时,手绘框架图、按关键字提示保存框架文件以及运用框架面板分析框架代码,可以快速地弄清框架网页的知识,正确建立符合要求的框架网页。

下面,我以如图1的框架结构的网页为例,谈一谈如何进行框架网页的学习。

一、手绘框架结构图

许多学生在初学框架网页时,在确定框架网页的样式后仅绘一个如图1那样由几根线条组成的结构图,这样的图是无法体现出框架网页各个对象的包含关系的,导致所建立的框架网页是凌乱的。我认为,采用手绘框架图的方法和步骤,细化各个框架,便可以帮助学生理清框架的结构及各对象的关系。

第一步:手绘框架,细化框架结构。

这里采用矩形嵌套的方法,从外到里的顺序绘制,按如图2步骤完成。先绘制外面最大的矩形(它含上方框架),再绘中间的矩形(含左侧框架),然后绘出最里面的矩形(含底部框架),最后使用一条直线将里面的矩形一分为二。这样既符合了“上方固定,左侧嵌套”的结构,又将框架页(内容页)从“底部框架”中分出来了。这样层层相套,各框架结构就很分明了。

第二步:标注框架名。

在新建框架网页时,软件会默认给各个框架命名,我们只需在提示“为每一个框架指定一个标题”时,按默认选择即可,同时在框架面板的各个框架内显示相应的框架名字。对于手绘的框架,我们也应分别为它们标上相应的框架名,为后面理解和分析代码提供了方便。如图3,在含有上方框架的大矩形内标上topFrame,在含有左侧框架的中间矩形内标上leftFrame,在含有底部框架的小矩形内标上bottomFrame,再在分出的内容页里标上mainFrame即可。这样有利于我们看懂框架图,为操作时保存各个框架文件做准备,这样的框架名将会在框架面板中对应显示。

第三步:标注所指文件。

在手绘的框架图上标注好框架名后,便是标注出要生成的框架集文件和各框架所指的文件。由于一个框架网页包含1个框架集文件和多个框架文件,其中每个框架对应一个文档,即一个文件。比方说,一个包含4个框架的框架集实际有5个文件:1个是总的框架集文件和4个分别包含了各自框架内的文件。就图1框架网页而言,共有5个文件要保存,含1个框架集文件和4个框架所指的文件。如图4,我们为这个框架集保存为index.htm的主页文件;而上方框架topFrame所指向的文件,即保存为1个文件:top.htm;左侧框架leftFrame所指向的文件,也要保存为1个文件:left.htm;里面小矩形的底部框架bottomFrame和框架页mainFrame分别要指向1个文件,即保存bottom.htm和main.htm這2个文件。依次标注这些文件名后,在保存操作时便可对照命名,提高操作的正确性。

二、根据关键字符保存框架网页文件

正确保存框架网页为后面学习和分析脚本代码提供保障。怎样才算正确保存完整的框架网页呢?由于一个框架网页文件的保存包括1个框架集文件和多个框架文件(含1个内容网页)的保存,所以需要认真对照才不至于保存的文件是混乱的。很多学生在保存时分不清是在保存“框架集”还是“框架”,我觉得最重要的一点是我们只要将关键字符Frameset是框架集、Frame是框架分别对应起来即可。

对于初学者,在首次保存框架网页时,建议选择“保存全部”命令。在“另存为”对话框中,默认会给出的文件名“UntitledFrameset-1.html”,当显示含有“Frameset”的字符时,表示这是在保存框架集文件,将它命名为之前标注的“index.htm”主页文件即可。如果给出默认的文件名中含有“Frame”的字符,我们对照“设计”窗口中毛边状的框架,再用对应的框架文件名保存就是。如果给出默认的文件名是“Untitled-1.html”,则保存为内容网页main.htm即可。

三、运用框架面板辨析框架代码

高考网页题以java代码为主,而中职学生的英文水平有限,理解能力较弱,我觉得学习框架部分的代码时,利用框架面板对照学习是最有效的。

当单击框架面板的任意边框或内容,代码窗口中相应的框架代码便会被选中,呈蓝底白字状态,且java代码和其他的程序代码一样,都是有层次感和递进效果的,具有嵌套关系。我们只需利用框架的嵌套方式来推理这些代码,就能理解哪个对象对应哪几行代码。另外,我们还可以利用代码窗口底部的状态栏上的一个个嵌套的标签,如框架集、框架,来分析代码。

图5中的代码便是上面标注好的框架图的部分框架代码(第8-17行)。

总之,在初学框架网页时,我们按照确定好的框架网页样式手绘框架图,细化框架结构,可理清框架的结构;按照提示的框架关键字符保存各个框架文件,灵活地利用框架面板分析框架部分的代码,相信框架网页的技术是不难掌握的。

参考文献:

[1]赵旭霞,刘素转,王晓娜.网页设计与制作[M].3版.北京:清华大学出版社,2018.

[2]杨杰,段欣.Dreamweaver CS5网页制作[M].北京:电子工业出版社,2013.

◎编辑 张 俐

猜你喜欢

字符框架结构矩形
矩形面积的特殊求法
正则表达式快速入门
图片轻松变身ASCⅡ艺术画
浅谈高层建筑框架结构施工质量控制措施
从矩形内一点说起
不掉到锁骨都不敢说是“矩形耳环
高层框架剪力墙结构抗震设计研究
我国电子商务与旅游业相结合的框架结构分析
考虑节点非弹性变形的RC框架地震反应分析
视频监视系统中字符叠加技术的应用