计算机网络应用基础第6章

上传人：春*** IP属地：天津上传时间：2023-03-10 格式：PPT 页数：84 大小：2.10MB 积分：50 举报 版权申诉

已阅读5页，还剩79页未读，继续免费阅读

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

第6章网页制作技术制作者：诸海生1本章内容6.1网页的基本概念6.2

HTML语言简介6.3使用FrontPage制作网页6.4

Flash简介26.1.1网页的三种基本形式HTML

文档请求Web服

务器WWW客

户端Internet静态网页6.1网页的基本概念静态网页的内容和格式由网页的设计者在制作时决定，不会有所变化，只有重新修改网页文件，静态网页的内容才会更新3静态网页的特点简单可靠。不需要编程经验访问速度比较快，Web服务器直接把静态网

页传给浏览器，并且浏览器可以使用本地磁

盘上的网页副本，加快了访问速度静态网页的测试比较简单静态网页缺乏灵活性，只有重新设计和修改

网页文件，才能使新的信息反映在更新后的

网页上4动态网页HTML文档请求中间件数据库服务器Web服务器WWW

客户端数据库Internet动态网页的网页内容事先不确定，在用户访问Web服务器时动态生成，是不断变化的5动态网页的特点可以反映在浏览器访问Web服务器时的最

新信息制作复杂。需要一定的程序设计基础知识

和编程经验，测试工作也比较复杂动态网页生成后，就成为与静态网页一样

的文档，不再具有动态更新的功能响应的时间比较长，通常比访问一个静态网

页的时间要长6在网页中嵌入了可以在客户端执行的小程序，随网页文件一起被浏览器下载，并在客户端运行，产生动态效果InternetWeb服务器WWW客户端数据库服务器数据库请求活动网页客户端应用程序(例如JavaApplet)活动网页7活动网页的特点可以持续更改网页内容，保证了信息的时效性增加了对客户端计算机的要求。浏览器必须支

持活动网页中运行的应用程序，客户计算机要

提供这些应用程序所必须的运行环境活动网页的设计制作需要更多的程序设计知识

和技巧，测试也比较困难对客户端计算机会带来更大的安全隐患活动网页要在客户计算机上运行程序，所以必

须解决客户端计算机的兼容性问题8

CGI(公共网关接口)是一种被广泛使用的建立动态网页的技术6.1.2网页制作的工具

HTML语言是用来描述超媒体结构的一个命令集，广泛用于网页设计中

ASP(动态服务器网页)是一个Web服务器端开发环境，利用ASP可以产生和执行动态的、交互的Web应用程序ASP文件的扩展名是.asp，运行在服务器端9脚本语言脚本是一种能够完成指定功能的短小程序段，其语句和命令的集合为脚本语言

用脚本语言编写的程序采用解释执行的方式不能独立运行，而要作为HTML文档的一部分在支持脚本语言的浏览器中运行既适用于客户端也适用于服务器端应用常用的脚本语言

JavaScript

VBScript

Java语言Java程序分为两种

Java应用程序Java应用程序的运行不需要浏览器，程序中要有一个主程序，程序的设计相对复杂。

JavaApplet主要用在网页制作中；JavaApplet没有主程序，而是嵌入在Web网页中，与Web页面一起被浏览器下载；JavaApplet程序不能存取本地文件

JSP(Java服务器网页)是一种跨平台、跨Web服务器的动态网页技术，与ASP类似11

XML是一种可以用来设计标记的语言

XML的特点实现了不同数据源之间的数据转换XML具有良好的跨平台性，为不同数据源交换数据提供了公共标准数据与显示格式分离，同一数据可多种显示可为一个XML文档指定多个样式文件，使其能有多种显示效果

实现了数据的分布式处理客户端收到XML文档后，既可以显示它承载的数据，也可利用应用程序在客户端对XML格式的数据进行处理，降低了服务器的负担

12标记HTML文档的每个元素由“标记”和标记所说明的内容组成。标记的一般格式为（外壳标记）

<标记>文本</标记>标记中可以含有属性，标记及属性中的字母大小写不限。6.2HTML语言简介标记属性名属性值标记说明的内容结束标记

例如：<palign=left>文本左对齐</p>6.2.1HTML的基本语法13注释注释的格式<!注释内容>或<!—— 注释内容

注释内容

——!>

HTML文档结构网页的内容网页的内容要放在<html>和</html>之间。网页内容可以分为两部分：网页头部和网页主体<html>

<head>

…

</head>

<body>

…

</body>

</html>网页头部网页体14标记意义Title

设置网页标题Base

设置基准URL。HTML文件中的标记在确定

链接地址时，会将自己的地址、文件名与这

个基准地址合并Link

用于指定当前网页与前页、后页的跳转关系Meta

用于记录HTML文件的相关信息常用于头部的标记

15<body>中的属性background背景图案的图像文bgcolor 背景颜色leftmargin左边距link

作为超链接载体的文字颜色text

网页中文本的颜色topmargin上边距vlink 已点击过的超链接载体文字的颜色16网页文件的编辑可以用任何文本编辑软件来编辑，在存盘时，扩展名应该是“.htm”或“html”

标题及属性共有6种标题标记，其中<h1>说明的标题最大<h1>、<h2>、…、<h6>align属性，用来指定标题的位置，值可以是：left、right、bottom、top、center，分别表示标题处在网页的左边、右边、底部、顶部和中间例如：<h2align=”left”>公司简介</h2>6.2.2编写简单的网页文件17文本的修饰字号属性，例：<fontsize=n>其中n—字号颜色属性，例：<bodytext=“red”>

字体属性，例：<fontface=“隶书”>设置文本外观的标记

标记含义示例显示的结果<B></B>

加粗<b>网页制作</b>

网页制作<I></I>

斜体<i>网页制作</i>

网页制作<U></U>

加下划线<u>网页制作</u>

网页制作<S></S>

加删除线<s>网页制作</s>

网页制作<SUB></SUB>

下标<fontsize=5>A<sub>5</sub>

A5<SUP></SUP>

上标<fontsize=5>A<sup>5</sup>

A518文本段落划分换行标记：<br>

分段标记：<p>文字</p>

插入水平线标记<hr>表示一条水平线，有多个属性width=x

水平线长度为x个像素width=x%

水平线长度为浏览器窗口的x%align=left、right或center

水平线对齐方式size=x

水平线的粗细为x个像素

19插入图形<imgsrc=”图形文件名”或”URL”>例如：<imgsrc=”c:\picture\008.jpg”><imgsrc=”/picture/001.jpg”>预格式化文本<pre></pre>当一段文本放入<pre>和</pre>之间，浏览器会保留该文本原有的格式，而不需加入<p>、<br>等标记20使用列表编号列表的格式

<ol>

<li>第1项列表说明

<li>第2项列表说明

…

</ol>在<ol>和<li>中可以使用type属性Type属性值适用范围编号显示方式

编号列表大写英文字母：A，B，C，…a

编号列表小写英文字母：a，b，c，…I

编号列表大写罗马数字：Ⅰ，Ⅱ，Ⅲ，…

编号列表小写罗马数字：ⅰ，ⅱ，ⅲ，…1编号列表阿拉伯数字：1，2，3，…

Disc

符号列表项目符号为实心圆点

Circle

符号列表项目符号为空心圆圈

Square

符号列表项目符号为实心方块21<html><head><title>例6-1</title></head><body><ol><li>家用电器<li>电动工具<li>电动模型<li>电动玩具</ol></body></html>22符号列表的格式<ul>

<li>第1项列表说明

<li>第2项列表说明

…

</ul><html><head><title>例6-3</title></head><body><ultype=circle><li>家用电器<li>电动工具<li>电动模型<li>电动玩具</ul></body></html>23定义列表的格式<dl>

<dt>第1个术语<dd>说明文字

<dt>第2个术语<dd>说明文字

…

</dl>

<html><head><title>例6-4</title></head><body><dl><dt>局域网:<dd>局域网是传输距离比较小的计算机网络。<dt>城域网:<dd>城域网的传输距离介于局域网和广域网之间。<dt>广域网:<dd>广域网是传输距离很远的计算机网络。</dl></body></html>24使用超链接文字超链接的格式<ahref=”链接目标”>链接载体</a>例如<ahref=””>搜狐</a>文字超链接的颜色

Link

未点击过的超链接载体文字的颜色

Vlink已经点击过的超链接载体文字的颜色

Alink具有焦点的超链接载体文字的颜色它们可以放在<bosy>中25链接目标的类型其他站点或网页的URL<ahref=””>清华大学</a>

本计算机上的一个文件ahref=”c:\index.htm”>返回主页</a>

电子邮件链接<ahref=”mailto:zhang@”>我的邮件</a>

本网页中的书签定义书签链接<ahref=”#书签名”>链接载体</a>

定义书签的名字和位置<aname=”书签名”>书签的显示文字</a>

26例…<ahref=”#s1”>第1节</a><ahref=”#s2”>第2节</a>…<aname=”s1”>第1节HTML基本语法</a>…<aname=”s2”>第2节编写简单网页</a>…27使用图像作为链接载体<ahref=”目标的URL”><imgsrc=”图像文件名”></a>

例如<ahref=””><imgsrc=”c:\picture\001.jpg”></a>

使用表格表格内容在<table>和</table>标记中，若要显示表格边框，则用border属性，例如：<tableborder>表格的表示以行为单位，在行中包含列其中：一个<tr>

</tr>标记表示一行一个<td></td>标记表示一列28<html><head><title>例6-6</title><body><tableborder><tr><td>品种</td>

<td>80g</td><td>第1食品厂</td></tr></table></body></html>例：左边代码产生如图所示的结果296.3使用FrontPage制作网页制作和发布站点的步骤①创建一个Web站点，即在本地计算机上用

FrontPage2000建立一个存放所有相关网页

的文件夹②建立和编辑网页③建立网页间的链接④在本组织的Web服务器上或选择一个提供自

由空间的ISP的Web服务器上发布这些网页6.3.1FrontPage2000简介30

FrontPage2000的界面

视图栏状态栏格式工具栏常用工具栏主窗口文件夹列表窗口31

FrontPage2000中的视图

网页视图可以进行网页的建立、编辑、预览等基本操作

文件夹视图其作用相当于资源管理器

报表视图可以了解本站点文件增加、更新、各类文件的数量、大小等情况

导航视图可从整体的角度了解各网页之间的链接结构，并以组织结构图的形式显示

超链接视图可从某个网页文件的角度来显示它与其他网页之间的链接关系

任务视图用来记录与创建、维护Web站点有关的所有细节，对大型Web站点的建立、管理很有用途326.2.2建立和编辑网页建立站点从“文件”菜单中依次选“新建”、“站点”命令文件夹的位置和名称33建立网页从“文件”菜单中依次选“新建”、“网页”命令34编辑网页使用“编辑”菜单或格式工具栏可以对网页中的文字进行编辑和修改输入和编辑中文的方法与Word基本相同插入图片插入文件中的图片

在弹出的对话框中输入文件的路径和文件名，单击“确定”按钮35选一个，单击选一个，单击单击插入在光标位置插入剪贴画

36使用项目符号或编号添加项目符号或编号37用图片作为项目符号可输入指定图片文件单击选择图片文件从网上找图片使用图片项目符号的例子38设置多级列表降一级升一级修改网页属性鼠标右键单击网页任意点39查看HTML文本预览网页406.3.3建立超链接链接的载体和链接目标链接的载体网页中超链接位置上显示的内容。可以是文字或图片链接的目标是要切换的显示内容所在的位置本站点上另一个网页本计算机上的一个文件其他站点上的某个网页某个电子邮件地址本网页上另一个位置(书签)41建立与本站点其他网页的超链接建立文字链接选中作为链接载体的文字单击链接目标可在其他文件夹中选择链接目标（建立图片链接步骤此类似）42建立到其他站点的超链接输入其他网页的URL在Internet上搜索43使用书签建立书签光标放在要建立书签的位置上输入书签名称书签44建立指向书签的超链接选中链接载体后打开“创建超链接”对话框45电子邮件链接选中链接载体后打开“创建超链接”对话框输入邮件地址46修改、删除超链接只需在“创建超链接”对话框，修改“URL”输入框中的链接目标，就可修改超链接删除“URL”输入框里的内容，则删除了超链接删除超链接的操作并不删除超链接的载体47超链接视图当前网页486.3.4使用表格表格的操作与Word中的操作很相似有3种方法可以创建表格使用常用工具栏上的按钮“表格”菜单，选“插入”、“表格”命令，在弹

出的“插入表格”对话框中设定表格的参数从“表格”菜单中选“手绘表格”命令手绘表格清除496.3.5使用导航栏导航栏可统一管理与其他网页的超链接，当修改网页之间的结构时，可以根据网页间的层次关系自动调整导航栏中出现的超链接，为设计者提供了极大的方便浏览网页时，导航栏的作用类似于一个网页索引，可以按照网页的层次关系，快速切换到感兴趣的网页上去在建立网页的导航栏之前，最好先确定网页之间的层次关系，这一工作可以在导航视图下完成50利用导航视图组织网页结构导航视图按钮已展开子层未展开子层导航工具栏当前网页51在网页中插入导航栏插入导航栏光标放在要插入导航栏的位置导航栏52删除导航栏修改导航栏单击要删除的导航栏，使其被选中，再按Delete键单击要修改的导航栏，使其被选中，从快捷菜单中选“导航栏属性”命令，可以弹出“导航栏属性”对话框，进行修改在导航视图中修改网页之间的层次关系，则所有网页的导航栏会自动调整

在导航视图中增加或删除网页，则所有网页中与该网页相关层的导航栏中也会自动增加或删除指向该网页的链接

536.3.6建立表单网页表单是一个可以容纳元素的“容器”，其中可放置多个元素，例如文本框、单选钮、复选框等，它们被称为表单域，用于反馈用户的意见用户在浏览器中向表单输入信息或选择上面的选项，并按了“提交”按钮后，输入的内容和选择的结果将记录在设计表单时所指定的文件中含有表单网页的站点应放在安装了FrontPage服务器扩展的服务器上54显示表单工具栏拖拽“表单”工具栏55插入表单先在网页中插入表单，再把表单域放在表单的区域内光标放在要插入表单的位置单击56使用文本框单击光标文本框右键单击57使用单选钮表单中可有多组单选钮，同名的单选钮为同组，每组可有一个被选中在表单中插入单选钮的方法与插入文本框类似，单选钮后面的说明性文字不属于表单域，可以直接在网页中输入使用复选框建立复选框的方法与单选钮类似，属性对话框也一样每个复选框都有选中或未选中两种状态，因此，每个复选框的名称必须是不同的58使用下拉菜单单击可在光标处插入下拉菜单编辑项目内容59使用按钮有3种按钮：“提交”、“全部重写”和“普通”，插入表单时自动插入“提交”和“全部重写”按钮，普通按钮的行为可用插入脚本的方法来定义单击可在光标处插入下按钮60使用表单的例子61保存表单结果可在“表单属性”对话框中指定存放结果的文件以及存放的格式鼠标右键单击表单区域中的任意位置626.4Flash简介6.4.1Flash的操作界面控制栏时间线控制区工具箱浮动面板主要工具栏时间线窗口舞台图层控制区63时间线窗口图层代表帧的单元格播放指针帧序号图层控制区时间线状态栏时间线控制区在图层控制区可以增加、删除图层，编辑图层的名称、类型、状态等内容时间线控制区中的每个单元格对应舞台上的一幅画面，一行单元格，表示一个图层中帧的顺序，播放时，将按照这个顺序切换帧64舞台浮动面板工具箱舞台是进行动画创作的主要工作区域，图形的制作编辑、动画的制作展示都在舞台中进行浮动面板是窗口，有多个选项卡，几乎包括了Flash中元素的所有属性线条颜色工具参数区线条工具钢笔工具椭圆工具铅笔工具墨水瓶工具吸管工具箭头工具索套工具文本工具矩形工具画笔工具油漆桶工具橡皮工具选取工具手形工具放大镜填充颜色工具箱中集中了在动画设计时可以使用的各种工具656.4.2图形和文字的创建与编辑基本图形的绘制绘制图形使用线条工具、椭圆工具、矩形工具可画几何图形铅笔工具可画出任意形状的线条“描绘”浮动面板，可设置线条和椭圆、矩形边框的类型、粗细和颜色画笔工具，可画出很粗的线画笔光标的大小画笔的形状线的类型线的颜色线的粗细66擦除图形使用橡皮工具，可以擦除图形水龙头橡皮形状和大小设置颜色线条色“调色板”浮动面板填充色67填充颜色单击工具箱中的油漆桶工具按钮，然后用鼠标单击封闭图形的中间，图形中的颜色就变为填充色添加文字单击工具箱中的文字工具，可在舞台上拖出一个区域，在区域中可以输入文字使用“字符”浮动面板可以设置字符的字号、字体、颜色，还可以修饰文字使用“段落”浮动面板可以设置段落的对齐方式68编辑对象对象的概念对象是指在Flash窗口中的元素选择对象单击箭头工具，再单击某个对象，该对象就处于选中状态，如果用鼠标画一个矩形区域，则区域中的多个对象都被选中修改对象形状单击工具箱上的选取工具，用鼠标单击一个几何图形的边框

单击边框放开鼠标键拖拽控点69移动和复制对象选中对象用鼠标拖拽，则所有被选中的内容一起被移动用剪贴板功能可以复制选中区域中的内容删除对象选中一个或多个对象，然后按Delete键改变对象的大小鼠标右键单击选中的对象，在弹出的菜单中选择“比例”命令，用鼠标拖拽对象周围的某一个控点70图符与实例图符是一个可以重复使用的图形，Flash带了很多图符，放在共享图库中一个图符可以在动画中多次使用，出现在动画中的图符对象称为实例使用Flash提供的图符“窗口”菜单中选“共享图库”命令，在子菜单中其中一个类型的所有图符名称选中的一个图符鼠标拖拽到舞台上，就产生一个实例71制作新图符从“插入”菜单中选“新建组件”命令输入组件名称选中单击

人人文库> 全部分类> 应用文书 > 事务文书

温馨提示

1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

计算机网络应用基础第6章

文档简介

温馨提示

最新文档

评论

计算机网络应用基础第6章

文档简介

温馨提示

最新文档

评论

相关文档