计算机文化基础ppt课件-第9章.ppt
《计算机文化基础ppt课件-第9章.ppt》由会员分享,可在线阅读,更多相关《计算机文化基础ppt课件-第9章.ppt(101页珍藏版)》请在淘文阁 - 分享文档赚钱的网站上搜索。
1、第第 九九 章章 网网 页页 制制 作作 目 录上一页下一页 结 束第九章 网页制作9.1 HTML简介简介 9.2 FrontPage概述概述 9.3网页制作网页制作 9.4网页布局网页布局 9.5创建表单页面创建表单页面 9.6网页的发布网页的发布 2/6/20231计算机文化基础 目 录上一页下一页 结 束9.1 HTML简介9.1.1 HTML语言概述语言概述9.1.2 HTML语言的基本语法语言的基本语法返 回2/6/20232计算机文化基础 目 录上一页下一页 结 束9.1.1 HTML语言概述 HTMLHTML即即HyperTextHyperText Markup Markup
2、Language(Language(超超文文本本标标记记语语言言)的的缩缩写写。它它使使用用一一些些约约定定的的标标记记(TagTag)对对文文本本进进行行标标注注,定定义义网网页页的的数数据据格格式式,描描述述WebWeb页页中中的的信信息息,控控制制文文本本的的显显示。示。我我们们把把用用HTMLHTML语语言言编编写写的的文文件件称称为为HTMLHTML文文件件(网网页页)。它它通通常常被被存存储储在在WebWeb服服务务器器上上,客客户户端端通通过过浏浏览览器器向向WebWeb服服务务器器发发出出请请求求,服服务务器器响响应应请请求求并并将将HTMLHTML文文件件发发送送给给浏浏览览
3、器器,然然后后由由浏浏览览器器对对文文件件中中的的标标记记作作出出相相应应的的解解释释,以以页页面面的的形形式式呈呈现现在在用用户户屏屏幕幕上上。因因此此,我我们们又又把把HTMLHTML文文档档在在WebWeb浏浏览览器中的这种表现形式称为器中的这种表现形式称为WebWeb页面页面(Web Page)Web Page)。HTML HTML语言是一种标记语言,简单易学。用语言是一种标记语言,简单易学。用HTMLHTML语言编写语言编写的网页实际上是一种文本文件,它以的网页实际上是一种文本文件,它以.htmhtm或或.htmlhtml为扩展名,为扩展名,我们可以使用任何文本处理软件(例如:记事本
4、)编写。我们可以使用任何文本处理软件(例如:记事本)编写。2/6/20233计算机文化基础 目 录上一页下一页 结 束HTML语言概述 HTMLHTML语语言言是是由由世世界界性性的的标标准准化化组组织织W3CW3C(World World Wide Wide Web Web ConsortiumConsortium)制制定定的的。通通过过浏浏览览http:/www.w3.orghttp:/www.w3.org可可以以了了解到解到HTMLHTML标准的最新动态。标准的最新动态。下面介绍下面介绍HTMLHTML文件的基本构成和文件的基本构成和HTMLHTML文件的层次结构。文件的层次结构。1.1
5、.HTMLHTML文件的基本构成文件的基本构成 InternetInternet中中的的每每一一个个HTMLHTML文文件件都都包包括括文文本本内内容容和和HTMLHTML标标记记两两部部分分。其其中中,HTMLHTML标标记记负负责责控控制制文文本本显显示示的的外外观观和和版版式式,并并为为浏浏览览器器指指定定各各种种链链接接的的图图像像、声声音音和和其其他他对对象象的的位位置置。多数多数HTMLHTML标记的书写格式如下:标记的书写格式如下:文本内容文本内容/标标记记名名写写在在“”内内。多多数数HTMLHTML标标记记同同时时具具有有起起始始和和结结束束标标记记,并并且且成成对对出出现现
6、,但但也也有有些些HTMLHTML标标记记没没有有结结束束标标记记。另外,另外,HTMLHTML标记不区分大小写。标记不区分大小写。2/6/20234计算机文化基础 目 录上一页下一页 结 束HTML语言概述 某某些些HTMLHTML标标记记还还具具有有一一些些属属性性。这这些些属属性性指指定定对对象象的的特特性性,如如背背景景颜颜色色、文文本本字字体体大大小小、对对齐齐方方式式等等。属属性性一一般般放放在在“开开始始标标记记”中中,格式如下:格式如下:2 文本内文本内容容/其中标记名和属性之间用空格分隔。如果标记其中标记名和属性之间用空格分隔。如果标记有多种属性,属性之间也要用空格分开。有多
7、种属性,属性之间也要用空格分开。2/6/20235计算机文化基础 目 录上一页下一页 结 束HTML语言概述2.2.HTMLHTML网页的结构网页的结构 现现在在我我们们先先看看一一个个简简单单的的HTMLHTML文文件件,从从中中体体会会用用HTMLHTML语言编写网页时的层次结构。语言编写网页时的层次结构。【例【例9-19-1】用】用HTMLHTML语言编写一个简单的网页。语言编写一个简单的网页。html我的第一个我的第一个WebWeb页页/title欢迎进入欢迎进入HTMLHTML世界!世界!/h1这这里里我我们们首首先先介介绍绍HTMLHTML语语言言的的基基本本知知识识和和语语法法。
8、然然后后,讲授如何使用讲授如何使用HTMLHTML语言编写您的语言编写您的WebWeb页面。页面。/p2/6/20236计算机文化基础 目 录上一页下一页 结 束HTML语言概述 将将上上述述代代码码用用文文本本编编辑辑器器编编辑辑并并保保存存为为一一个个扩扩展展名名为为.htmhtm的的文文件件,双双击击该该文文件件图图标标,在浏览器中看到如下图所示的结果。在浏览器中看到如下图所示的结果。图9-12/6/20237计算机文化基础 目 录上一页下一页 结 束HTML语言概述 从从上上例例可可以以看看出出,一一般般HTMLHTML文文件件都都是是以以 html开开头头,以以/html结结束束。其
9、其文文件件结结构构由以下两部分组成:由以下两部分组成:1 1)头部()头部(HeadHead)HTMLHTML文文件件的的头头部部由由 head和和/head标标记记定定义义。通通常常情情况况下下,文文件件的的标标题题、语语言言字字符符集集信信息息等等都都放放在在头头部部信信息息中中。最最常常用用到到的的标标记记是是 title,它它用用于于定定义义网网页页文文件件的的标标题题,当当该该网网页页文文件件被被打打开开后后,网网页文件的标题将出现在浏览器的标题栏中。页文件的标题将出现在浏览器的标题栏中。2/6/20238计算机文化基础 目 录上一页下一页 结 束HTML语言概述2 2)正文主体()
10、正文主体(BodyBody)正正文文主主体体是是HTMLHTML文文件件的的核核心心内内容容,由由 body和和/body标标记记定定义义。body标标记记具具有有一一些些常常用用的的属属性,格式如下:性,格式如下:=#n color=#n其中,其中,bgcolorbgcolor为背景颜色,为背景颜色,colorcolor为文本颜色。为文本颜色。n n为六位十六进制数。为六位十六进制数。如果网页使用背景图像,格式为:如果网页使用背景图像,格式为:bodyHTMLHTML对格式的要求并不严格,当对格式的要求并不严格,当HTMLHTML文件被浏览文件被浏览器扫描时,所有包含在文件中的空格、回车等均
11、器扫描时,所有包含在文件中的空格、回车等均被忽略了。因此你可以将一行写成两行或多行,被忽略了。因此你可以将一行写成两行或多行,在浏览器中结果是相同的。在浏览器中结果是相同的。返 回2/6/20239计算机文化基础 目 录上一页下一页 结 束9.1.2 HTML语言的基本语法1.1.文本布局文本布局 1 1)段落标记)段落标记 p标标记记指指定定文文档档中中一一个个独独立立的的段段落落。通通过过设设置置alignalign属属性性,控控制制段段落落的的对对齐齐方方式式,其其值值可可以以是是leftleft、centercenter、rightright,分分别别表表示示左左对对齐齐、居居中中和和
12、右右对齐,默认值为左对齐。对齐,默认值为左对齐。使用格式如下:使用格式如下:p标记定义的两个段落之间留有一个空行。标记定义的两个段落之间留有一个空行。2 2)换行标记)换行标记 标记可以强制文本换行。该标记只有开始标记。标记可以强制文本换行。该标记只有开始标记。3 3)水平线标记)水平线标记 hr水平线标记水平线标记 hr用于在网页中插入一条水平线。用于在网页中插入一条水平线。2/6/202310计算机文化基础 目 录上一页下一页 结 束HTML语言的基本语法2.2.文字格式文字格式HTMLHTML语言中用于文字格式化的标记有:语言中用于文字格式化的标记有:1 1)标题标记)标题标记 格式为:
13、格式为:标题文字内容标题文字内容/其其中中n n说说明明大大小小级级别别,取取值值范范围围为为1 1到到6 6的的数数字字。把把标标题题分分为为 6 6级级,即即h1h6h1h6,其中其中h1h1文字最大,文字最大,h6h6文字最小。文字最小。2 2)字体标记)字体标记 font字体标记用来对文字格式进行设置,主要具有以下属性:字体标记用来对文字格式进行设置,主要具有以下属性:(1 1)sizesize属性用来控制文字的大小,其格式为:属性用来控制文字的大小,其格式为:font size=n其中其中n n的取值范围为的取值范围为1 17 7的数字,默认值为的数字,默认值为3 3。font标标记
14、记和和 标标记记都都可可以以控控制制文文字字的的大大小小。一一般般情情况况下下,文文章章的的标标题题最最好好由由 标标记记控控制制,而而其其余余的的文文字字由由 font标标记记控制。相比较而言,控制。相比较而言,font对字体的控制更加灵活。对字体的控制更加灵活。2/6/202311计算机文化基础 目 录上一页下一页 结 束HTML语言的基本语法(2 2)colorcolor属性用来控制文字的颜色,其格式为:属性用来控制文字的颜色,其格式为:font 其中其中n n是一个十六进制的六位数。是一个十六进制的六位数。(3 3)faceface属性用来指明文字使用的字体,其格式为:属性用来指明文字
15、使用的字体,其格式为:font 其其中中,字字体体名名的的选选择择由由WindowsWindows操操作作系系统统安安装装的的字字体体决决定定。如:宋体、楷体如:宋体、楷体_ _GB2312GB2312、Times New RomanTimes New Roman、ArialArial等。等。3 3)字形标记)字形标记 字字形形标标记记用用于于设设置置文文字字的的粗粗体体、斜斜体体、上上标标、下下标标、下下划划线等,如下表所示。线等,如下表所示。标记格式标记格式字形结果字形结果粗体粗体斜体斜体下划线下划线上标上标下标下标2/6/202312计算机文化基础 目 录上一页下一页 结 束HTML语言
16、的基本语法3.3.插入图片插入图片 标标记记将将图图片片插插入入网网页页中中。可可以以设设置置图图片片的的大大小小以以及及相相邻邻文文字字的的排列方式。该标记具有以下属性:排列方式。该标记具有以下属性:(1 1)srcsrc属性:指明图片文件所在的位置。格式为:属性:指明图片文件所在的位置。格式为:=URL 其中其中URLURL是指图片文件存放的位置。是指图片文件存放的位置。(2 2)altalt属属性性:图图片片的的文文字字说说明明,当当鼠鼠标标指指针针指指向向图图片片时时,该该图图片片的的说说明明性性文字弹出。格式为:文字弹出。格式为:(3 3)heightheight和和widthwid
17、th属性:设置图片显示区域的高度和宽度。格式为:属性:设置图片显示区域的高度和宽度。格式为:=URL height=n1 width=n2 其其中中heightheight和和widthwidth属属性性的的取取值值n1n1和和n2n2为为像像素素数数,像像素素数数越越大大,图图片片显显示越大。示越大。(4 4)borderborder属性:设置图片文件的边框。格式为:属性:设置图片文件的边框。格式为:=URL border=n 其中其中n n为像素数。为像素数。2/6/202313计算机文化基础 目 录上一页下一页 结 束HTML语言的基本语法(5 5)alignalign属性:设置图片相对
18、于文本的位置关系。格式为:属性:设置图片相对于文本的位置关系。格式为:对对齐齐方方式式可可以以是是:toptop(顶顶边边对对齐齐)、middlemiddle(垂垂直直居居中中)、bottombottom(底底边边对对齐齐)、leftleft(左左对对齐齐)、rightright(右右对对齐)。齐)。4.4.超链接超链接 在在HTMLHTML语语言言中中,a和和/a标标记记用用于于设设置置网网页页中中的的超超链接链接hrefhref属性指明被超链接的文件地址。格式为:属性指明被超链接的文件地址。格式为:=URL超链接文本超链接文本/a 用用于于表表示示超超链链接接的的文文本本一一般般显显示示为
19、为蓝蓝色色并并且且加加下下划划线线。在在浏浏览览器器中中,当当鼠鼠标标指指针针指指向向该该文文本本时时,箭箭头头变变为为手手形形,并在浏览器的状态栏中显示该超链接的地址。并在浏览器的状态栏中显示该超链接的地址。若使用图片做超链接,可使用如下格式完成:若使用图片做超链接,可使用如下格式完成:=URL22/6/202314计算机文化基础 目 录上一页下一页 结 束HTML语言的基本语法5.5.使用表格使用表格 在在网网页页中中插插入入一一个个表表格格,需需要要用用到到一一组组HTMLHTML标标记记。定义表格的有关标记如下:定义表格的有关标记如下:table 定义表格。定义表格。定义表行。定义表行
20、。td 定义表列。定义表列。常常用用的的标标记记属属性性中中,borderborder属属性性用用于于设设置置表表格格边边框框的的宽宽度度;widthwidth、heightheight属属性性设设定定表表格格或或表表项项的的宽宽度度、高高 度度,取取 值值 可可 以以 是是 像像 素素 数数 或或 百百 分分 数数;cellspacingcellspacing和和cellpaddingcellpadding属属性性分分别别用用于于设设置置单单元元格格之之间间的的间间隙隙和和单单元元格格内内部部空空白白;alignalign属属性性设设置置表表格格或或表表项项的的对对齐齐方方式式;bgcolo
21、rbgcolor和和backgroundbackground属属性性设设置置表格背景的颜色和背景图像。表格背景的颜色和背景图像。返 回2/6/202315计算机文化基础 目 录上一页下一页 结 束9.2 FrontPage 2000概述 虽虽然然使使用用一一般般的的文文本本编编辑辑器器就就可可以以编编写写HTMLHTML文文档档,但但是是使使用用专专门门的的HTMLHTML编编辑辑器器或或WebWeb创创作作工工具具往往往往更更加加方方便便。具具有有“所所见见即即所所得得”功功能能的的WebWeb页页面面创创作作工工具具可可以以使使WebWeb创创作作人人员员直直接接面面对对WebWeb页页面
22、面进进行行编编辑辑修修改改,并并且且能能立立即看到即看到WebWeb页面的显示效果。页面的显示效果。FrontPageFrontPage是是微微软软公公司司开开发发的的网网页页制制作作 和和 网网 站站 管管 理理 工工 具具。FrontPage FrontPage 20002000是是Microsoft Microsoft Office Office 20002000的的 组组 件件 之之 一一,与与OfficeOffice的的其其他他组组件件高高度度融融合合。它它界界面面友友好好,功功能能强强大大,易易学学易易用用,是是目目前前使使用用较较为为广广泛泛的网页制作、网站管理工具之一。的网页制
23、作、网站管理工具之一。2/6/202316计算机文化基础 目 录上一页下一页 结 束9.2 FrontPage 2000概述9.2.1 FrontPage 2000的主要功能的主要功能9.2.2 FrontPage 2000的启动与退出的启动与退出9.2.3 网页与网站网页与网站9.2.4 FrontPage 2000的编辑方式的编辑方式9.2.5 FrontPage 2000中的视图中的视图返 回2/6/202317计算机文化基础 目 录上一页下一页 结 束9.2.1 FrontPage 2000的主要功能 FrontPage 2000FrontPage 2000的主要功能是制作网页和管理网
24、站。的主要功能是制作网页和管理网站。使使用用FrontPage FrontPage 20002000可可以以创创建建新新的的网网页页,也也可可以以打打开开并并修修改改已已经经存存在在的的网网页页。FrontPage FrontPage 20002000提提供供了了多多种种编编辑辑网网页页的的方方式式,不不但但可可以以直直接接修修改改HTMLHTML,而而且且可可以以采采用用“所所见见即即所所得得”的的方方式式编编辑辑网网页页,还还可可以以使使用用菜菜单单命命令令插插入入各各种网页元素,使用对话框修改其属性,十分灵活。种网页元素,使用对话框修改其属性,十分灵活。在在FrontPage Front
25、Page 20002000中中,可可以以很很容容易易地地插插入入文文本本、图图片片、表表格格、组组件件等等元元素素;可可以以使使用用主主题题,共共享享边边框框,框框架架等等管管理网页的外观;还可以使用表单等元素设计出交互式网页。理网页的外观;还可以使用表单等元素设计出交互式网页。FrontPage FrontPage 20002000提提供供了了强强大大的的站站点点管管理理功功能能。一一组组相相关关网网页页和和有有关关文文件件组组成成一一个个站站点点,站站点点也也是是FrontPage FrontPage 20002000对对网网站站进进行行管管理理的的基基本本单单位位。在在FrontPage
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 计算机 文化 基础 ppt 课件
限制150内