HTML语言基础PPT课件
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
示例：<br>称为换行标记，当浏览器遇到 <br>标记时，将换行显示文本
-
10
⑵双标记指令
语法： 格式1 <标记名称>要控制的内容</标记名称> 格式2 <标记名称 属性=属性值 …>要控制的内容</标记名称>
说明： ①用<标记名称>作为双标记指令的开始，用</标记名称>作为双
标记指令的结束，将要控制的内容安排在这一对标记中间 ②格式2与格式1的不同之处是后者在开始标记中带有起辅助作用
-
14
HTML基本标记的使用方法(续)
4.文件标题标记(<title>…</title>) 语法： <title>文件标题文字</title> 说明：此标记用于设定HTML文件的标题名
称，它将显示在浏览器的标题栏中。 注意：<title>标记用于<head>标记中。但如
果HTML文件中没有使用<head>标记，则 <title>标记仍然起作用。
Leabharlann Baidu
-
15
HTML基本标记的使用方法(续)
5.文件主体标记(<body>…</body>)
语法： <body>…</body>
说明：
①由<body>标记所建立的元素是HTML文件 的内容主体，也是HTML文件的重点所在。 HTML文件中要显示在网页上的所有内容， 也都放置在这个元素中。
②<body>具有一些特殊的属性，可以设定背 景及字符颜色等。
..…….
</BODY> </HTML>
-
8
HTML的标记和元素
1.HTML标记 HTML之所以称为“超文本标记语言”，一
是因为它的超链接功能，二是因为它的指令统一 采用了“标记”表示法。HTML中主要有单标记 指令和双标记指令两种。 2.HTML元素
如果用两个一组的HTML标记把一段文字包 含在其中，则此段文字与包含文字的HTML标记 称为一个HTML元素。
如果使用单独的HTML标记，则此HTML标记 也被称为一个HTML元素。
-
9
⑴单标记指令
语法：<指令>
说明：用一对（两个为一对）尖括号“<”和 “>”作为标志符号，将要执行的指令包含 在这一对尖括号之中；如果成对的标志符 号中少了一个，则当浏览器解释时就会出 现错误。标记本身不会出现在显示结果中， 只对显示格式起作用。
HTML语言
- 辽宁工程技术大学软件学院
1
内容提要
一、HTML语言概述 二、文字版面的编辑 三、文字列表的设计 四、表格的设计 五、HTML的超链接 六、图片的使用 七、窗口框架 八、高级HTML使用 九、表单设计
-
2
一、HTML语言概述
-
3
Web页面与HTML文档
Web上的信息是以页面(Page)的形式组织起 来的，Web页面由HTML描述。Web页面与 HTML文档实际上是同一事物的两个不同侧面： 人们通常把用HTML编写的文件称为HTML文档， 而把HTML文档在Web浏览器中的表现形式称为 Web页面。
语法： <!--注释内容-->
2.文件标记(<html>…</html>)
语法： <html>…</html>
说明：<html>这对标记是HTML文件的标记。 <html>处于文件的最前面，表示HTML文 件的开始。即浏览器从<html>标记开始解 释，直到遇到</html>标记为止。
-
13
HTML基本标记的使用方法(续)
<title>HTML实例</title> </head> <body>
<!-- 简单的HTML文件 --> <p>Hello World！</p> <br> </body> </html>
-
7
HTML文档的基本构成
<HTML> <HEAD> ……… </HEAD> <BODY> <标签1 [属性[=属性值]] [属性[=属性值]].....> <标签2 [属性[=属性值]] [属性[=属性值]].....> ........... [</标签2>] [</标签1>]
❖ 标准通用标记语言SGML
Standard Generalized Markup Language
❖ 超文本标记语言HTML
Hyper Text Markup Language
❖ 可扩展标记语言XML
eXtensible Markup Lan-guage
5
HTML编辑器与HTML语言的学习
❖ 使用编辑器生成页面可能会产生的问题：
3.文件头标记(<head>…</head>) 语法： <head>…</head> 说明： ①由head这组标记定义的元素中，并不放置网页
的任何内容，而是放置关于这份HTML文件的信 息。就是说，它并不属于HTML文件的主体，它 包含文件的标题、编码方式和URL等。这些信息 大部分用于提供索引、辨认或其他应用。 ②这对标记在HTML文件中并不是必需的。如果某 个HTML文件并不需要提供相关信息，则可省略 <head>标记。
的属性参数。可以包含若干参数，也可没有参数。
-
11
HTML的层次概念
<html> <head> …… </head> <body> …… </body>
</html>
HTML文档基本结构
html head body
HTML文件的层次结构
-
12
HTML基本标记的使用方法
1.注释标记(<!--…-->)
▪ 在编辑界面下的显示效果与用浏览器看到 的很可能会不同；
▪ 会产生一些复杂的、非标准的代码，难以 达到设计的效果，从而容易引起浏览器之 间的兼容问题；
▪ 一些特殊的页面控制，必须通过HTML代码 才可以实现。
❖ 可以借助于HTML编辑器，但不能依赖于它。
-
6
简单的HTML实例
<html> <head>
Web页面中有一种称为主页(Hompage)的特 殊页面。主页通常是用户通过Web浏览器访问某 一Web站点时看到的第一个页面，用户通过主页 可以访问该站点的其他页面。因此主页一般是关 于某一组织、机构或个人的基本信息的页面。
-
4
标记语言
❖ 什么是标记？ ▪ 最基本的定义：标记是用于指明文档中文本格式编 排的代码系统 ▪ 标记语言的发展 SGMLHTMLXML
-
16
二、文字版面的编辑
-
17
取消文字换行标记<nobr>
语法：<nobr>
说明：显示一个HTML文件时，浏览器会根据窗口 的大小，调整每行显示的文字数和段落。如果想 禁止这项功能，取消因窗口大小不同而产生的换 行，就应该使用<nobr>标记。
-
10
⑵双标记指令
语法： 格式1 <标记名称>要控制的内容</标记名称> 格式2 <标记名称 属性=属性值 …>要控制的内容</标记名称>
说明： ①用<标记名称>作为双标记指令的开始，用</标记名称>作为双
标记指令的结束，将要控制的内容安排在这一对标记中间 ②格式2与格式1的不同之处是后者在开始标记中带有起辅助作用
-
14
HTML基本标记的使用方法(续)
4.文件标题标记(<title>…</title>) 语法： <title>文件标题文字</title> 说明：此标记用于设定HTML文件的标题名
称，它将显示在浏览器的标题栏中。 注意：<title>标记用于<head>标记中。但如
果HTML文件中没有使用<head>标记，则 <title>标记仍然起作用。
Leabharlann Baidu
-
15
HTML基本标记的使用方法(续)
5.文件主体标记(<body>…</body>)
语法： <body>…</body>
说明：
①由<body>标记所建立的元素是HTML文件 的内容主体，也是HTML文件的重点所在。 HTML文件中要显示在网页上的所有内容， 也都放置在这个元素中。
②<body>具有一些特殊的属性，可以设定背 景及字符颜色等。
..…….
</BODY> </HTML>
-
8
HTML的标记和元素
1.HTML标记 HTML之所以称为“超文本标记语言”，一
是因为它的超链接功能，二是因为它的指令统一 采用了“标记”表示法。HTML中主要有单标记 指令和双标记指令两种。 2.HTML元素
如果用两个一组的HTML标记把一段文字包 含在其中，则此段文字与包含文字的HTML标记 称为一个HTML元素。
如果使用单独的HTML标记，则此HTML标记 也被称为一个HTML元素。
-
9
⑴单标记指令
语法：<指令>
说明：用一对（两个为一对）尖括号“<”和 “>”作为标志符号，将要执行的指令包含 在这一对尖括号之中；如果成对的标志符 号中少了一个，则当浏览器解释时就会出 现错误。标记本身不会出现在显示结果中， 只对显示格式起作用。
HTML语言
- 辽宁工程技术大学软件学院
1
内容提要
一、HTML语言概述 二、文字版面的编辑 三、文字列表的设计 四、表格的设计 五、HTML的超链接 六、图片的使用 七、窗口框架 八、高级HTML使用 九、表单设计
-
2
一、HTML语言概述
-
3
Web页面与HTML文档
Web上的信息是以页面(Page)的形式组织起 来的，Web页面由HTML描述。Web页面与 HTML文档实际上是同一事物的两个不同侧面： 人们通常把用HTML编写的文件称为HTML文档， 而把HTML文档在Web浏览器中的表现形式称为 Web页面。
语法： <!--注释内容-->
2.文件标记(<html>…</html>)
语法： <html>…</html>
说明：<html>这对标记是HTML文件的标记。 <html>处于文件的最前面，表示HTML文 件的开始。即浏览器从<html>标记开始解 释，直到遇到</html>标记为止。
-
13
HTML基本标记的使用方法(续)
<title>HTML实例</title> </head> <body>
<!-- 简单的HTML文件 --> <p>Hello World！</p> <br> </body> </html>
-
7
HTML文档的基本构成
<HTML> <HEAD> ……… </HEAD> <BODY> <标签1 [属性[=属性值]] [属性[=属性值]].....> <标签2 [属性[=属性值]] [属性[=属性值]].....> ........... [</标签2>] [</标签1>]
❖ 标准通用标记语言SGML
Standard Generalized Markup Language
❖ 超文本标记语言HTML
Hyper Text Markup Language
❖ 可扩展标记语言XML
eXtensible Markup Lan-guage
5
HTML编辑器与HTML语言的学习
❖ 使用编辑器生成页面可能会产生的问题：
3.文件头标记(<head>…</head>) 语法： <head>…</head> 说明： ①由head这组标记定义的元素中，并不放置网页
的任何内容，而是放置关于这份HTML文件的信 息。就是说，它并不属于HTML文件的主体，它 包含文件的标题、编码方式和URL等。这些信息 大部分用于提供索引、辨认或其他应用。 ②这对标记在HTML文件中并不是必需的。如果某 个HTML文件并不需要提供相关信息，则可省略 <head>标记。
的属性参数。可以包含若干参数，也可没有参数。
-
11
HTML的层次概念
<html> <head> …… </head> <body> …… </body>
</html>
HTML文档基本结构
html head body
HTML文件的层次结构
-
12
HTML基本标记的使用方法
1.注释标记(<!--…-->)
▪ 在编辑界面下的显示效果与用浏览器看到 的很可能会不同；
▪ 会产生一些复杂的、非标准的代码，难以 达到设计的效果，从而容易引起浏览器之 间的兼容问题；
▪ 一些特殊的页面控制，必须通过HTML代码 才可以实现。
❖ 可以借助于HTML编辑器，但不能依赖于它。
-
6
简单的HTML实例
<html> <head>
Web页面中有一种称为主页(Hompage)的特 殊页面。主页通常是用户通过Web浏览器访问某 一Web站点时看到的第一个页面，用户通过主页 可以访问该站点的其他页面。因此主页一般是关 于某一组织、机构或个人的基本信息的页面。
-
4
标记语言
❖ 什么是标记？ ▪ 最基本的定义：标记是用于指明文档中文本格式编 排的代码系统 ▪ 标记语言的发展 SGMLHTMLXML
-
16
二、文字版面的编辑
-
17
取消文字换行标记<nobr>
语法：<nobr>
说明：显示一个HTML文件时，浏览器会根据窗口 的大小，调整每行显示的文字数和段落。如果想 禁止这项功能，取消因窗口大小不同而产生的换 行，就应该使用<nobr>标记。