《（教育精品）任务一了解网站的基本结构》由会员分享，可在线阅读，更多相关《（教育精品）任务一了解网站的基本结构（34页珍藏版）》请在金锄头文库上搜索。
1、第二节第二节 网站建设网站建设 网络技术应用网络技术应用 PPTPPT电子讲义电子讲义 1 新课引入新课引入 学习做网页之前，我们首先要知道网页是什么 ，一般来说网页是用在网络上的htm文件，通过网页 可以很方便的实现网络资源的共享，上网分为三个 步骤； 1、输入正确的网址 2、找超级链接 3、后退按钮 2 1 1、输入正确的网址、输入正确的网址 1）在桌面上找到Internet Explorer ，双击打开，出现浏览 器窗口，一般会自动进入微软的网站； 2）找到地址栏一个长白条，里面有一串以http打头的字符 ，这就是地址栏 3）在地址栏里头点一下鼠标左键，然后删除里面的字符， 输入自己的的
2、网址，网址一般是英文的以http打头，然后是 一个冒号和两个斜杠（双斜杠），然后是www（三W），后 面跟一个点，最后一般是com结尾，例如输入 输完检查一下，没问题就按一下回车键 ，这时窗口右上角的小图标就开始运动，也就是正在搜索； 4)一切正常就会进入到搜狐网站的首页； 3 2 2、找超级链接、找超级链接 网页上的内容是一页一页的，一般都藏在一个叫超链接 的后面，所以第二步就是要找到超链接； 超链接有三个特点，首先文字的颜色是蓝色的，非常醒目 ，其次文字下面有一条下划线，便于查找，最关键的是当鼠 标移过去以后，指针会变成手形 ，这一点很重要； 找到超链接以后就可以鼠标左键单击，进入相应的内
3、容了 ； 4 3 3、后退按钮、后退按钮 看完一页后如何返回呢？在窗口的左上角有一个后退按 钮 ，点一下就可以回到上一页，这样就不会迷失 方向了； 其他还有浏览、下载、另存为等等也都是网络的功能 ； 本节学习了上网的基础知识，学习了上网的三步曲， 网址超链接和后退，那么接下来我们继续学习网页制作软 件FrontPage 2003。 5 本章学习目录本章学习目录 4.1 FrontPage 2003概述 4.2 网页基本元素编辑 4.3 网页布局 4.4 表单应用 4.5 网站发布及管理 思考题 6 4.1 FrontPage 20034.1 FrontPage 2003概述概述 4.1.1 功
4、能特点 4.1.2 窗口界面 4.1.3 基本操作 7 4.1.1 4.1.1 功能特点功能特点 FrontPage让初学者无需掌握HTML语言或具备编程基础知识 便能够编写出界面优美、功能完善的网站。下面简单介绍一 下FrontPage的特点。 “所见即所得”的网页编辑环境，也就是说，用户在网页编辑 窗口中看到的效果就是浏览器中显示的效果。 易学易用的操作界面，像其它Office套件一样，在 FrontPage中集成了大量的网页模板和网站向导，让用户很 方便快捷地制作出优美的网页。 功能强大的新版本FrontPage融合了网页管理、网页编辑、 网页发布和网站维护等多种功能，利用FrontPa
5、ge制作的网 页支持最新的网页标准，比如DHTML、XML、CSS2等等。 8 4.1.2 4.1.2 窗口界面窗口界面 FrontPage 2003主界面主要由菜单栏、工具栏、视图栏、 状态栏、主编辑窗口和任务窗格等6大部分组成。 9 1 1“ “网页网页” ”视图视图 选择【视图】【网页】命令，打开网页视图。 网页视图是FrontPage中最常用的工作界面，网页的创建、 编辑、预览等基本操作都是在此视图中进行的。网页视图窗 口底部有4个标签：“设计”、“拆分”、“代码”和“预览”，它们 分别控制着网页的4种显示模式。在设计模式下，能够以“所 见即所得”的方式编辑网页；在代码模式下，可以查看
6、或编 辑网页的HTML的源代码；在预览模式下，可以预览网页的效 果；在拆分模式下，能够同时编辑网页和查看或编辑网页的 HTML的源代码。 10 1 1“ “网页网页” ”视图视图 11 2 2“ “文件夹文件夹” ”视图视图 单击 “视图”栏 中的“文件夹”图 标或选择【视图 】【文件夹】命 令，打开文件夹 视图。 在文件夹视图下 ，网站显示为一 组文件和文件夹 。在此视图下可 以对网站中的文 件夹和各种文件 进行管理。 12 3 3“ “报表报表” ”视图视图 单击“视图”栏中的“报表”图标或选择【视图】【报表】命令， 打开报表视图。 通过报表视图，可以在运行报表查询后分析网站内容。 13
7、4 4“ “导航导航” ”视图视图 单击“视图”栏中的 “导航”图标或选择 【视图】【导航 】命令，打开导 航视图。 导航视图用于管 理网站中各网页 的层次关系结构 图。可以通过鼠 标将结构图中的 网页拖到新位置 来改变链接结构 。 14 5 5“ “超链接超链接” ”视图视图 单击“视图”栏中“超链接”图标或选择【视图】【超链接】命令 。 超链接视图用于管理网站中网页的超链接。 15 6 6“ “任务任务” ”视图视图 单击“视图”栏中的“任务”图标或选择【视图】【任务】命令，可 打开任务视图。 任务视图可以实现网站任务的管理。网站的任务是指网站管理 人员维护网站的任务，包括网页的更新和网站
8、的检查等。 16 7 7“ “远程网站远程网站” ”视图视图 可以使用“远程网站”视图发布整个网站，或有选择地 发布个别文件。还可以在两个或多个位置之间同步文 件，即确保包含相同内容的网站都包含最新的更改。 17 7.1.37.1.3基本操作基本操作 1网站的规划 2网站的基本操作 3网页的基本操作 18 1 1网站的规划网站的规划 首先要明确建立网站的目的。 其次要明确网站的浏览者群。 最后要考虑到如何能够便于网站的日常维护。 19 2 2网站的基本操作网站的基本操作 1) 创建网站 创建一个Web网站有两种方法。第一种方法是利用FrontPage 的Web网站模板和向导，这种方法操作简单、
9、速度快，比较适 合建立大、中型的Web网站。第二种方法是逐个地创建网页文 件，然后创建它们之间的链接关系，这种方法适合于网页数 量不多的小型网站。 使用FrontPage模板创建网站的步骤： 启动FrontPage应用程序； 选择【文件】【新建】命令，打开“新建”任务窗格； 选择网站模板，在“新建网站”栏选择“由一个网页组成的网站 ”，打开“网站模板”对话框，在“指定新网站的位置”文本框 中输入新网站的位置及名称，然后单击“确定”按钮。 20 2）关闭网站 选择【文件】【关闭网站】命令。 关闭网站即关闭网站及该网站下的所有网页。 3）打开网站 选择【文件】【打开网站】命令，“打开网站”对话 框
10、。 选择网站名称，然后单击“打开”按钮。 2 2网站的基本操作网站的基本操作 21 3 3网页的基本操作网页的基本操作 1）新建网页 在FrontPage 2003中可以直接创建一个空白网页，也 可以利用网页模板和网页向导来创建。 在某网站中创建新网页，在此网站的文件夹视图和导 航视图方式下单击视图窗口右上角的“新建网页”按钮 。 创建不属于某网站的新网页，在任何视图方式下，选 择【文件】【新建】命令，打开“新建”任务窗格， 可在新建任务窗格中，选择一种合适的模板新建网页 ；或者单击常用工具栏上的“新建”按钮 。 22 2）打开网页 打开当前网站中的网页，在任何视图中双击该网页图标或文 件名即
11、可打开网页。 打开其它网站中的网页，选择【文件】【打开】命令，在“打 开文件”对话框中选择具体网页文件打开。 3）保存网页 保存当前网站中的网页，单击工具栏中的保存按钮，或【文 件】【保存】命令即可。如果网页中有图片，则会弹出“保存 嵌入式文件”对话框，提示保存图片文件。 保存不属于当前网站中的网页，则需要指定保存路径。 4）关闭网页 选择【文件】【关闭】命令。这种方式关闭的仅是当前网页 ，要注意与关闭网站的区别。 3 3网页的基本操作网页的基本操作 23 1 1文本添加文本添加 在网页中添加文本与在Word中添加文本的操作基 本相同。此外，在网页中输入文本时，如果已经 达到网页边界，则文本会
12、自动回滚到下一行继续 输入，这种换行方式并不会产生新行或是一个新 段落，随着网页边界的变化或是编辑窗口的调整 ，FrontPage 2003会自动调整这个回滚位置。 按下+键将产生新行，即换行， 新行与上一行之间没有回滚关系。 按下键产生一个新段落。 24 2 2设置段落和文本格式设置段落和文本格式 可以使用格式工具栏（如图7.2.1所示）或“字体” 和“段落”对话框对文本和段落的格式进行设置。 其操作方法跟Word基本相同。 25 3 3插入水平线插入水平线 为了修饰页面，明显区分开标题与正文，可选择【插入】 【水平线】命令在当前光标点插入一条水平线。双击水平 线或选择【格式】【属性】命令弹
13、出“水平线属性”对话框 ，可对水平线的高度、宽度、颜色和对齐方式进行设置。 26 4 4设置网页属性设置网页属性 网页属性是一个网页整体的 属性，记录关于网页的非页 面部分的相关信息。适当的 设置可以达到增加网页美观 和缩减网页文件大小的效果 。 方法一：右击页面，从弹出 的快捷菜单中选择“网页属性” 命令。 方法二：选择【格式】【背 景】命令； 方法三：选择【文件】【属 性】命令； 27 5 5插入图像插入图像 插入一幅关于“背景”的剪贴画的操作步 骤： 将插入点定位在需要插入图片的位置 ； 选择【插入】【图片】【剪贴画】命 令，打开“剪贴画”任务窗格，如图所示 ； 在任务窗格中，用户可在“
14、搜索文字”文 本框中输入剪贴画的关键字“背景”； 单击“搜索”按钮开始搜索，在任务窗格 下方列表框中列出了搜索到的剪贴画 ； 单击剪贴画右侧的下三角按钮，弹出 剪贴画的快捷菜单，单击“插入”命令即 可。 28 编辑图像编辑图像 在网页中插入图像后，还可对图像进行编辑。用鼠标单 击选取图像，在屏幕上就会出现“图片”工具栏。利用“图 片”工具栏可对图片进行旋转、剪裁、冲蚀，设置凹凸效 果、透明背景色，调整亮度、对比度以及在图片中加入 文字等。选中图片后，拖动图片周围的控点可改变图片 大小。 29 设置图片属性设置图片属性 选定所需的图片，单击鼠标右键，从快捷菜单中选择“图 片属性”命令，弹出“图片
15、属性”对话框。在对话框的“常规” 和“外观”两个选项卡中进行设置，可以做出各种图文混排 的页面效果。 30 超链接是从一个网页指向另一个目的地的指针， 这个目的地可以是另一个网页或同一个网页中的 其他位置，也可以是一个电子邮件、一个Word文 档或者是一个应用程序。 创建超链接的步骤： 选择链接的载体； 选择链接的目标； 指定目标窗口。 6. 6. 超链接创建超链接创建 31 验证超级链接验证超级链接 上面的三个步骤设置完成后，超链接的创建便完成 了。接下来有必要验证一下超链接是否正确，可用 如下的方法来验证： 网页的设计视图中，把鼠标移到已经创建了超链接 的载体上（文字、图像），鼠标变成手状，按下 键，然后单击鼠标，便可验证链接目的地。 在网页的预览视图中，用鼠标单击创建了链接的载 体，便可验证链接目的地。 32 设置超链接的状
