07第7章 网页制作.pptVIP

第7章 网页制作 济南大学·信息学院 第7章 网页制作 7.1 网页制作概述 7.2 FrontPage 2003的基本知识 7.3 网页编辑 7.4 表单 7.5 发布站点 7.1 网页制作概述 7.1.1 HTML简介 7.1.2 网站制作的准备工作 7.1.1 HTML简介 7.1.2 网站制作的准备工作 7.2 FrontPage 2003基本知识 7.3 网页编辑 7.3.1 网页的基本编辑 7.3.2 编辑表格 7.3.3 框架 7.3.1 网页的基本编辑 7.3.2 编辑表格 7.3.3 框架 7.4 表单 上机实验一 * * HTML（超文本标记语言），是英文HyperText Markup Language的缩写。 它虽然称为“语言”，但实际上并不是一种编程语言，不象C、C++、Java等编程语言那么复杂。HTML描述的是文件中各个部分内容的结构，而不是文件内容在显示器上出现的具体形式。 HTML定义了一组用来描述Web页的结构（如标题、段落和表格等）的“命令”，这些命令在HTML中称为标记或标签（Tag）。 HTML文件以html开始，以/html结束，其文件结构由头部和正文主体两部分组成。 在FrontPage中，新建网页，切换到“代码”视图下查看源代码。 HTML文件的基本结构 html…/html：网页开始、结束标记 head…/head：头部标记 body…/body：正文主体标记 用“”和“”括起来的句子称为标签，是用来分割和标记文本的元素，以形成文本的布局、文字的格式及五彩缤纷的画面。 1) 单标签 某些标签称为单标签，因为它只需单独使用就能完整地表达意思。 这类标签的语法是：标签 最常用的单标签就是BR，它表示换行，但并不划分段落。 HTML标记的属性 2)?双标签 双标签必须成对使用才能完整地表达意思. 这类标签的语法是：标签.../标签 如段落标记p.../p，它表示在标签内部的内容构成一个段落。 3)??标签属性 始标记内可以包含一些属性，描绘不同的特性。 其语法是：标签 属性1 属性2 属性3 … 如body background=images/bg.jpg.../body HTML标记的属性 常见的HTML标记 1)文本布局标签 标记名称：段落标记p，双标签 标记实例：p align=center江雪/p 说明：属性align取值为left、center、right，分别表示左对齐、居中对齐、右对齐。 标记名称：换行标记br br强制文本换行，但不划分段落，与p标记不同，两行的间距不变。 标记名称：水平线标记hr 说明：在网页中插入一条水平线 常见的HTML中的标签 2)文本格式标签 标记名称：标题标记hn，双标签 标记实例：h1江雪/h1 说明：其中n为1到6的数字，表示字体大小。 标记名称：字体标记font，双标签 标记实例： font size=1 color=#ff0000 face=宋体江雪/font 标记名称：字形标记b、i、sup、sub、u，双标签，分别表示粗体、斜体、上标、下标、下划线。 常见的HTML中的标签 3) 图片标签 标记名称：图片标记img 标记实例：img src= /img_menu/jnunamergss.gif height=200 width=60 align=center border=1 4) 表格标签 　table…/table 5) 超链接标签 标记名称：超链接标记a…/a ，双标签 1. 网站结构的统筹 大致规划网站的组成、文档的层次结构及相互的链接关系，做到统筹安排。 2. 素材的准备 为了使网站内容充实、页面美观漂亮，必需准备丰富的多媒体素材。包括诗词文稿、背景图片、按钮图片、声音文件等等。素材的来源可以是来自互联网，也可以借助常见的图像处理工具，如Photoshop、Flash、Fireworks、COOL3D等等自己制作图像素材。 准备工作 3. 选择网页设计制作工具 现在有很多现成的HTML编辑器，如微软公司开发的FrontPage、Macromedia公司开发的Dreamweaver等等，这些都是目前比较流行的“所见即所得”式网页编辑器。但实际上，网页是用HTML语言编写的文件，通常被存储在Web服务器上，其本质是一种文本文件，以.htm或.html为扩展名，可以用任何文本处理软件（如记事本、Word等）创作或修改。 7.2.1 启动与退出 7.2.2 FrontPage 2003的视图 7.2.3 FrontPage 2003的基本操作 7.