《网页设计与制作》课程教学资源（PPT课件讲稿）第一章 HTML基础

一章小儿基 -11什么是HTML Web页的基本概念 HTML的工作原理 创建和测试Web页

第一章 HTML基础 ▪ 1.1 什么是HTML 一．Web页的基本概念 二．HTML的工作原理 三．创建和测试Web页

1.2创建Web页 标记符基础 Web页的基本结构 设置页面属性 四.添加注释 五.显示特殊字符

一．标记符基础 二．Web页的基本结构 三．设置页面属性 四．添加注释 五．显示特殊字符 1.2创建Web页

!9页的基本念 nternet与WWW 浏览器 网站 主页 URL

1.1.1 Web页的基本概念 ▪ Internet与WWW ▪ 浏览器 ▪ 网站 ▪ 主页 ▪ URL

J nternet URL 网络 一数据通信网 Uniform resource 信息资源网 locator(统一资源定 口 :网址) WWW服务(网页浏览服务) (World wide web 网站 位于相同或不同计算机(服务器) 系列逻辑上可以视为整体的页 上的网页通过超链接组织在二起, 面 形成象蜘蛛网一样的W系统 网站就是一个链接的页面集合 Server(服务器 主页 BOMN间+或个大图 就是对网页进行显示。 始点的页面,这是大多数服务 的索引文件。主页的名称 是固定的( index htm或 index html 注意

▪ Internet – 网络 – 数据通信网 – 信息资源网 ▪ www服务（网页浏览服务） （World wide web） 位于相同或不同计算机（服务器） 上的网页通过超链接组织在一起， 形成象蜘蛛网一样的WWW系统。 ▪ Server (服务器） ▪ Browser(浏览器） 获取WWW服务的基础，它的基本功 能就是对网页进行显示。 ▪ URL Uniform resource locator（统一资源定 位器：网址） ▪ 网站 一系列逻辑上可以视为整体的页 面 网站就是一个链接的页面集合。 ▪ 主页 主页是网站中的一个特殊的页面， 它是一个组织或个人在WWW上 开始点的页面，这是大多数服务 器默认的索引文件。主页的名称 是固定的（index.htm或 index.html ） 注意

网页 网页 务 m

 服务器     网页 网页

无意的题 口网站中必须有一个文件—网页文件的名称在服务 的名字是“ index htm”器上是区分大小写的。 或” index htm”这是大 多数服务器默认的索引 index. html 文件,别人访问你的主 INDEXHTML 页的时候,这个文件就 是你的主页的大门

注意的问题 ▪ 网站中必须有一个文件 的名字是“index.htm” 或”index.html”这是大 多数服务器默认的索引 文件，别人访问你的主 页的时候，这个文件就 是你的主页的大门。 ▪ 网页文件的名称在服务 器上是区分大小写的。 index.html INDEX.HTML

2小儿的工作原理 Html( Hyper Text Markup Language 超文本标记语言 Hypertext(超文本 文本中包含指向其他位置或文件的链接( Hyper link)通过这些链接使文档组织一 成了网状结构 ■原理:通过使用标记符,告诉浏览器如何显 示网页,即确定内容的显示格式,浏览器按 顶序读取HTML文件,根据内容周围的HTML 标记符解释和显示各种内容。 示例

1.1.2HTML的工作原理 ▪ Html（Hyper Text Markup Language） 超文本标记语言 ▪ Hypertext（超文本） 文本中包含指向其他位置或文件的链接（Hyper link）通过这些链接使文档组织 成了网状结构。 ▪ 原理：通过使用标记符，告诉浏览器如何显 示网页，即确定内容的显示格式，浏览器按 顺序读取HTML文件，根据内容周围的HTML 标记符解释和显示各种内容。 示 例

圆实质就是纯文本文作 metahttp-equiv="content-type"content="text/html;charset=gb2312> tite这是测试文件1 HTML文件就写在这里 文本左对齐 文本居中对齐文本右对齐 可以用任何文本编辑器编辑HTML文件,例如:Word, WINDOWS 系统自带的记事本, Ultra edit等,并且可以方便的使用 Word, WINDOWS系统自带的对网页进行简单的测试

网页实质就是纯文本文件 这是测试文件1 HTML文件就写在这里------ 文本左对齐 文本居中对齐 文本右对齐 可以用任何文本编辑器编辑HTML文件，例如：Word,WINDOWS 系统自带的记事本，Ultra Edit 等，并且可以方便的使用 Word,WINDOWS系统自带的IE对网页进行简单的测试

创健Web页(动记事术 测试We页(双击保存的文件 网页编辑工具 HTML编辑器 Homesite Hotdog Pro等 所见即所得的编辑器 Dreamwerver和 Frontpage

▪ 创建Web页（启动记事本） ▪ 测试Web页（双击保存的文件） ▪ 网页编辑工具 – HTML编辑器 Homesite Hotdog Pro等 – 所见即所得的编辑器Dreamwerver和Frontpage

1.21标记符基础 基本的HTML语法 标记符的结构 标记符都用尖括号括起来,内容 例如:这里是标题文字格式 2、标记符的属性 对标记符作用的内容进行更详细的控制,放在开始标记符 的尖括号里, 内容例如:

1.2.1标记符基础 基本的HTML语法 1、标记符的结构 标记符都用尖括号括起来，内容 例如：这里是标题文字格式 2、标记符的属性 对标记符作用的内容进行更详细的控制，放在开始标记符 的尖括号里， 内容例如： 示例