《计算机应用基础》课程教学资源（PPT课件讲稿）HTML网页设计基础

考试题型 理工科 判断题 (10分) 单选题 (10分) 填空题(20分) sql与html命令 (20分) 编程题(30分)

考试题型 理工科 判断题（10分） 单选题（10分） 填空题（20分） sql与html命令（20分） 编程题（30分）

第七章 网页设计基础 7.I HTML网页设计技术基础 ●7.I.I HTML概述 ●7.I.2HTML文档头部设计 ●7.I.3HTML主体设计 7.2HTML中多种元素的引用 ●7.2.I HTML中多媒体元素的引用 ●7.2.2HTML中的表格 ●7.2.3HTML中的表单 ●7.2.4HTML中的框架

第七章 网页设计基础 7.1 HTML网页设计技术基础 ⚫7.1.1 HTML概述 ⚫7.1.2 HTML文档头部设计 ⚫7.1.3 HTML主体设计 7.2 HTML中多种元素的引用 ⚫ 7.2.1 HTML中多媒体元素的引用 ⚫ 7.2.2 HTML中的表格 ⚫ 7.2.3 HTML中的表单 ⚫ 7.2.4 HTML中的框架

7.I HTML网页设计技术基础 HTML (Hyper Text Markup Language) ·超文本标记语言，是用来描述因特网上 网页内容和外观的标准语言。 ·超文本指的是用超链接的方法，将各种 不同空间的文字信息组织在一起的网状 文本，超文本中还可以包含图像、音频、 视频等非文本的多媒体元素

7.1 HTML网页设计技术基础 HTML（Hyper Text Markup Language）  超文本标记语言，是用来描述因特网上 网页内容和外观的标准语言。  超文本指的是用超链接的方法，将各种 不同空间的文字信息组织在一起的网状 文本，超文本中还可以包含图像、音频、 视频等非文本的多媒体元素

7.I.I HTML概述 (一)HTML的概念 HTML标记：HTML文档中使用标记来定义并描述HTML元素 、、、、、等 多数标记是成对出现，,表示标记所定义范围的开 始和结束少数标记（例如)是单标记。 HTML标记的属性： HTML源文件： 用HTML编写的超文本文档称为HTML源文件，可以使用任何文本编 辑器编辑HTML源文件，存盘时使用.htm或.html作为文件扩展名即可 一个HTL文档对应一个网页，主页文件名默认为index.htm或 index.html

7.1.1 HTML概述 （一）HTML的概念 HTML标记：HTML文档中使用标记来定义并描述HTML元素 ◦ 、、、、、等 ◦ 多数标记是成对出现， ，表示标记所定义范围的开 始和结束；少数标记（例如）是单标记。 HTML标记的属性： ◦ HTML源文件： ◦ 用HTML编写的超文本文档称为HTML源文件，可以使用任何文本编 辑器编辑HTML源文件，存盘时使用.htm或.html作为文件扩展名即可。 一个HTML文档对应一个网页，主页文件名默认为index.htm 或 index.html

(二)HTML的基本语法结构 个完整的HTML文档包含头部和主体两部分， 般由三对标记定义HTML文档的框架结构。 I.HTML的基本结构 网页标题 文档主体内容

（二）HTML的基本语法结构  一个完整的HTML文档包含头部和主体两部分， 一般由三对标记定义HTML文档的框架结构。  1. HTML的基本结构 网页标题 文档主体内容

2.相关标记简介 和 明确文档开始和结束； 。和定义文档的头部； ·和定义文档主体； 。和定义网页标题

2. 相关标记简介  和 明确文档开始和结束；  和 定义文档的头部；  和 定义文档主体；  和 定义网页标题

7.2HTML文档头部设计 ● TML文档的头部(head)提供关于网 页的标题、作者、搜索关键字等信息。 其一般格式如下： 网页标题:

7.1.2 HTML文档头部设计  HTML文档的头部（head）提供关于网 页的标题、作者、搜索关键字等信息。 其一般格式如下： 网页标题

● 【例7-1】网页头部设计示例。 HTML头部设计示例 。在标记之间定义的网页标题“HTML头部设 计示例”，将显示在浏览器窗口的标题栏。 ● 标记用于定义网页相关信息，该标记有多个属性， 用于指定网页设计者、搜索关键字、网页刷新等信息。上 例中定义了搜索引擎的搜索关键词为“大学之道，在明明 德

 【例7-1】网页头部设计示例。 HTML头部设计示例  在标记 之间定义的网页标题“HTML头部设 计示例”，将显示在浏览器窗口的标题栏。  标记用于定义网页相关信息，该标记有多个属性， 用于指定网页设计者、搜索关键字、网页刷新等信息。上 例中定义了搜索引擎的搜索关键词为“大学之道，在明明 德

7.I.3HTML主体设计 (一)页面布局与基本标记 (二)HTML的文字格式设置 (三)文字列表 (四)文本的超链接

7.1.3 HTML主体设计 （一）页面布局与基本标记 （二）HTML的文字格式设置 （三）文字列表 （四）文本的超链接

(一)页面布局与基本标记 1.页面布局 ()网页背景 (2)网页前景色 (3)网页页边距 2.基本标记 ()设置正文标题 (2)设置文字段落标记 (3)设置文字换行标记 (4)设置文字不换行标记 (5)设置水平线标记 (6) 设置代码注释标记

（一）页面布局与基本标记 1. 页面布局 (1) 网页背景 (2) 网页前景色 (3)网页页边距 2. 基本标记 （1）设置正文标题 （2）设置文字段落标记 （3）设置文字换行标记 （4）设置文字不换行标记 （5）设置水平线标记 （6）设置代码注释标记