1.2.1 HTML 简介[共2页]
HTML使用教程
HTML使用教程一、HTML简介HTML（HyperText Markup Language）是一种常用的标记语言，用于创建网页结构和内容。
本章将介绍HTML的基本概念和语法规则。
1.1 HTML的发展历程HTML最早是由李爵士（Tim Berners-Lee）于1991年创建的，用于在因特网上发布和共享文档。
随着互联网的发展，HTML逐渐成为构建网页的标准语言。
1.2 HTML元素和标签HTML文档由多个元素组成，每个元素都由开始标签和结束标签包围。
元素的内容位于开始标签和结束标签之间。
1.3 HTML基本结构一个简单的HTML文档由DOCTYPE声明、html标签、head标签和body标签组成。
其中，DOCTYPE声明定义了文档的类型，而head标签和body标签分别定义了文档的头部和主体部分。
二、HTML常用标签本章将介绍HTML中常用的标签，包括文本标签、链接标签、图像标签等。
2.1 文本标签HTML提供了多种文本标签，如标题标签（h1至h6）、段落标签（p）、换行标签（br）等，用于展示不同级别的标题、段落和换行。
2.2 链接标签链接是网页中常用的元素，可以通过使用链接标签（a）在网页之间进行跳转。
链接标签使用href属性指定跳转的目标URL。
2.3 图像标签在网页中插入图像可以丰富页面内容，HTML提供了图像标签（img）来实现这一功能。
图像标签使用src属性指定图像的URL。
三、HTML表单HTML表单是网页中用户输入和提交数据的主要方式，本章将介绍HTML表单的创建和常见表单元素的使用。
3.1 创建表单使用表单标签（form）可以创建一个HTML表单。
表单标签的action属性指定数据提交的URL，method属性定义提交数据的方式（GET或POST）。
3.2 表单元素HTML提供多种表单元素，如文本输入框（input type="text"）、单选按钮（input type="radio"）、复选框（input type="checkbox"）等。
HTML介绍
Page 12
1.2 HTML结构
根据 HTML 标准，仅有几个标签在 HTML 的头部分是合 法的。
标签
<head> <title> 定义关于文档的信息。 定义文档标题。
描述
Page 21
1.4.1 标签
HTML 标题
HTML 标题（Heading）是通过 <h1> - <h6> 等标签 进行定义的。<h1> 定义最大的标题，<h6> 定义最小 的标题。 实例1：
<h1>This is a heading</h1> <h2>This is a heading</h2> <h3>This is a heading</h3>
Page 17
1.3 页面类型
静态页面VS动态页面
静态页面，也就是HTML语言编辑出的页面。
• 缺点是：相对于动态页面来说支持的功能少 • 优点是：浏览速度快，占用服务器资源小
动态页面，用ASP、JSP、PHP 等语言编辑的页面。
• 缺点是：占用系统资源大，浏览速度相对静态页面来说 慢一些 • 优点是：方便管理，功能强大，可扩展性高
注释：浏览器会自动地在标题的前后添加空行。默认 情况下，HTML 会自动地在块级元素前后添加一个额 外的空行，比如段落、标题元素前后。
Page 22
1.4.1 标签
实例2： <html>
html简介
html简介1、什么是htmlHTML是⽤来制作⽹页的标记语⾔HTML是Hypertext Markup Language的英⽂缩写,即超⽂本标记语⾔在html中，虽然有⽂本，但是这些⽂本需要使⽤html语⾔中的标记来标识。
当被html中的标记标识之后的⽂本，它就超出了我们所理解的简单⽂档范畴。
不再是⼀个普通的⽂本。
⽽这些⽂本可以被浏览器进⾏识别，并且以不同的形式展⽰在浏览器上。
HTML语⾔是⼀种标记语⾔,不需要编译,直接由浏览器执⾏HTML⽂件是⼀个⽂本⽂件,包含了⼀些HTML元素,标签等.HTML⽂件必须使⽤html或htm为⽂件名后缀HTML是对⼤⼩写不敏感的,HTML与html是⼀样的；但是我们⼀般规定：书写时⼀律⼩写HTML是由W3C组织的维护的2、html⽂件的书写规范任何的语⾔书写的源码代码都有⾃⼰的书写规范。
html规范：约定: 所有的html代码都需要保存在html 标签中格式：Html可以分为三个部分：1.html标签：html⽂件的所以代码都要在html标签中。
2.head标签：head标签中的内容不会浏览器的窗体中显⽰。
Title标签是⽹页的标题名称。
3.body标签：body标签中的代码才会显⽰在浏览器的窗体中。
3、html标签介绍通常要⽤两个⾓括号括起来:“<”和“>”。
标签都是闭合的（两种格式：双标签（成对）与单标签（不成对）双标签：<标签名>标签名称</标签名> 如：<table></table> 分结束标签和开始标签单标签：<标签名/> 如：<br/> <hr/> 注意：由于html是⼀种弱势语⾔，所以如果单标签不写 / ⼀般也不会报错，但如果放在某些规定⽐较严格的浏览器上运⾏，可能会出现问题，所以，建议还是按照规范的格式写代码标签是⼤⼩写⽆关的,<body>跟<BODY>表⽰意思是⼀样的，标准推荐使⽤⼩写，这样符合XHTML标准 标签的属性：格式：<标签名属性名1="属性值" 属性名2="属性值" ... 属性名>书写内容</标签名>HTML属性⼀般都出现在HTML标签中, 是HTML标签的⼀部分。
1[1].2HTML语言
![1[1].2HTML语言](https://img.taocdn.com/s3/m/3f09d268011ca300a6c39039.png)
>: 起始标记的结束。 我们从这个例子可以看出，标记在使用是必须用方括号“<>”括起来，而 且是成对出现，无斜杠的标记表示该标记的作用开始，有斜杠的标记表示 该标记的作用结束。在HTML中，标记的大小写作用相同，如<TABLE>和 <table>都是表示一个表格的开始。 但是有一点需要我们注意的是，虽然HTML语言描述了文档的结构格式， 但并不能精确的定义文档信息该如何显示和排列，而只是建议Web浏览器 应该如何显示和排列这些信息，最终在用户面前的结果取决于Web浏览器 本身的显示风格以及它对标记的理解能力。这就不难解释为什么同一文档 在不同的浏览器里会出现不同的显示效果。
这时，编写HTML文档的任务由开发工具替你完成了。这是网页制作 工具的最大成功之处，但也是它们的最大不足之处。因为受到图形 编辑工具自身的约束，将产生大量的垃圾代码。原因很简单，比如： 在我们在网页里设计了一个表格，若是每个单元格的宽度和高度让 它根据其中的内容自动确定，HTML只要你告诉它是表格和单元格的 排列顺序（也就是行列数）就行了，但因为图形化开发工具无法得 知你的这种特殊要求，所以只能取一般要求，把每个单元格的宽度 和高度都定义起来，从而增加了许多代码。所以一个明智的网页编 写者应该在掌握图形编辑工具的基础上进一步学会HTML语言，从而 知道哪些是垃圾代码，这样，我们就可以利用图形化HTML开发工具 快速成地做出网页，又会消除无用的代码，从而达到快速制作高质 量网页的目的.。这也是我们学习HTML语言的目的。
2.“文件头”标记符(Meta)
文件头标记符也就是通常见到的Meta标记符，Meta标记符在网页中是 看不到的，因为它包含在HTML语言的“<head>…</head>”标记符之间，而 通常我们所见到的网页内容只有在“<body>…</body>”之间的才可以在文 档中显示出来.Meta是文件头标记符中常用的一个标记符，说明与网页有 关的信息，如创作工具，文件作者等。这些标记符可以为服务器提供参考 信息，如发布日期，刷新设置等.Meta主要是针对网络中的搜索引擎建立 的，它的信息被搜索引擎猎取并被提取所需要的内容.在Meta中常用的属 性有：name、Http-equiv和content。Name给出特性名，content给出特 性值，告知网页使用的是HTML语言，应用gb2312字符集，Http-equiv属性 指定HTTP响应名称，通常用于替换name，HTTP服务器使用该属性值为HTTP 响应消息头收集信息.
HTML基础知识
2.4 HTM L标记
2.图像标记<IMG>
在HTML中，使用IMG标记在网页中加入图像。它具有 两个基本属性src和alt，分别用于设置图像文件的位置和替 换文本。
上一页 下一页 返回
2.4 HTM L标记
2.4.6超链接标记
1.相对地址与绝对地址 URL 统一资源定位符，也被称为网页地址，是表示互联
上一页 下一页 返回
2.4 HTM L标记
2.4.3文本标记
1.<FONT> <FONT>标记用于控制网页上文字的字体，大小和颜色。
控制方式是利用属性设置得以实现的。 2.特殊符号
某些字符在HTML中具有特殊意义，如小于号(<)即定 义HTML标记的开始。这个小于号是不显示在最终看到的网 页单的。那如果希望在网页中显示一个小于号，该怎么办呢? 要在浏览器中显示这些特殊字符，就必须在HTML文档中使 用字符实体。
在<TD>和<TH>标记内使用colspan的取值表示水平 方向上合并的列数。
上一页 下一页 返回
2.4 HTM L标记
2.4.8表单标记
1.表单元素 <FORM>标记：用于在网页中创建表单区域，属于一
个容器标记，表示其他表单标记需要在它的包围中才有效。 其属性介绍如下。 action用来设置接收和处理浏览器递交的表单内容的服务器程 序的URL。 method：此属性告诉浏览器如何将数据发送给服务器，它指 定向服务器发送数据的方法(用POST方法还是用GET方法)。
上一页 下一页 返回
2.4 HTM L标记
2.4.10脚本标记
有时，网页中的一些特殊效果击要加入脚本语言才能够 实现，脚本语言是一种简化的编程语言，它可以生成许多的 网页特效，如滚动的文字、雪花效果、波浪效果等。‘常用 的脚本语言有3种，分别是JavaScript， VBScript和 Jscript。其中JavaS cript是IE不II Navigator都完全 支持的脚本语言，所以使用得最广泛。
Html简介
Html简介Html简介全写： HyperT ext Mark-up Language 译名：超文件注标式语言（译名之一）简释：一种为普通文件中某些字句加上标示的语言，其目的在于运用标记（tag）使文件达到预期的显示效果。
HTML 是在SGML 定义下的一个描述性语言，或可说HTML 是SGML 的一个应用程式，HTML 不是程式语言，如 C++ 和 Java 之类，它只是标示语言，基本上你只要明白了各种标记的用法便算学懂了HTML，HTML 的格式非常简单，只是由文字及标记组合而成，于编辑方面，任何文字编辑器都可以，只要能将文件另存成ASCII 纯文字格式即可，当然以专业的网页编辑软件为佳。
■ 阅读须知：这一篇【HTML剖析】偏重于标记的介绍，考虑到易懂及每节的篇幅问题，我并不按 W3C 的 HTML 分类，这可令你更易选择有兴趣的标记，其中只有【文件标记】是必读的，其余可任意选择。
这一篇不会提及任何网页编辑软件，只要掌握了 HTML ，任何网页编辑工具都可以变成一把利器。
■ 标记写法：•任何标记皆由"<"及">"所围住，如<P>•标记名与小于号之间不能留有空白字符。
•某些标记要加上参数，某些则不必。
如size="+2">Hello•参数只可加于起始标记中。
•在起始标记之标记名前加上符号"/"便是其终结标记，如</font> •标记字母大小写皆可。
■ 围堵标记与空标记：标记按型态分为围堵标记与空标记1.围堵标记顾名思义，它以起始标记及终结标记将文字围住，令其达到预期显示效果。
例如 HTML Source ：Creation of Webpageis my favourite. 显示成：Creation of Webpage is my favourite.其中便称为围堵标记。
1 HTML简介
上一页
下一页
HTML的英文全名为Hypertext Markup Language，译为超文本标记语 言。HTML用于描述超文本中资料的 显示方式，从控制文字的颜色、大小， 到标识资料的种类为图形文件或者声 音等。其描述的方式是利用一个个的 HTML标签，将要进行格式控制的资 料包含起来。
15
上一页
（简称NC）和Internet Explorer（简
下一页
称IE）。
7
1.3 网页设计基本概念
上一页
下一页
1．超链接（Hyper Link） 超链接是特殊的文字标记，它指向 了万维网中的其他资源，如另外一个网 页、一个声音文件、网页的另一个段落 或者是万维网中的任何资源等等，而且 这些资源均可以存放在任何一个服务器 上。 在浏览网页时，如果你用鼠标单击 超链接，那么就会跳转到超链接所指向 的资源，就可从Web上下载新的信息。
上一页
下一页
3．网站（Web site） 网站是一个存放在网络服务器 上的完整信息的集合体。它包含一 个或多个网页，这些网页以一定的 方式链接在一起，成为一个整体， 用来描述一组完整的信息或达到某 种期望的宣传效果。
11
上一页
下一页
4．网页（Web pages） 网页是网站的组成部分。制作者 可以将需要公布的信息按照一定的方 式分门别类，放在一个个网页上，网 页里可以有文字、表格、图像声音和 视频等等。网页可以看作一个单一体， 是网站的一个元素，它是磁盘上的一 个个单一的文件，由Web浏览器下载 或格式化。
第1章 HTML简介
1.1 1.2 1.3 1.4 1.5 1.6 1.7 WWW的基本概念 浏览器 网页设计基本概念 网页技术概况 HTML简介 HTML的编辑和运行环境 HTML的基本结构
第1章 HTML简介
种属性，比较常用的属性是“ 可以是“ 种属性，比较常用的属性是“Aligh＝#”。“#”可以是“Left”、“Center”或“Right”，其含义同上文。浏览器 ＝ 。 可以是 、 或 ，其含义同上文。 是基于窗口的，用户可随时改变显示区的大小， 将多个空格以及回车等效为一个空格， 是基于窗口的，用户可随时改变显示区的大小，所以 HTML 将多个空格以及回车等效为一个空格，这和通常的文 字处理器不同。 字处理器不同。 源文件中插入注释，注释在显示时会被浏览器忽略， （3）注释标识：用来在 HTML 源文件中插入注释，注释在显示时会被浏览器忽略，在浏览器窗口中是不可见 ）注释标识： 的。它以"<!--"开头，以"-->"结束，即"<!-开头， 结束， 它以 开头 结束 4．文件的路径名 ． （1）绝对路径：绝对路径是写出文件所在位置的全部路径，系统按照全部路径时文件进行查找。绝对路径中 ）绝对路径：绝对路径是写出文件所在位置的全部路径，系统按照全部路径时文件进行查找。 的盘符后用“ 分隔开。 的盘符后用“：\”或“：/”，各个目录名之间以及目录名与文件名之间应用“\”或“/”分隔开。绝对路径名 或 ，各个目录名之间以及目录名与文件名之间应用“ 或 分隔开 所示。 的写法及其含义如表 1-1-1 所示。 （2）相对路径：相对路径是以当前文件所在路径和子目录为起始目录，所查找文件相对于这个其实目录的相 ）相对路径：相对路径是以当前文件所在路径和子目录为起始目录， 对位置。通常都采用相对路径，这样可以保证文件整体移动后，不会产生断链现象。相对路径名的写法及其含义 对位置。通常都采用相对路径，这样可以保证文件整体移动后，不会产生断链现象。 所示。 如表 1-1-2 所示。 5．URL ． 统一资源定位器（ 上的地址编码。 统一资源定位器（uniform resource locator，URL）是某一文件在 WWW 上的地址编码。它指出了文件在 ， ） Internet 中的位置，这样就不会出现重复或由于编码不统一而出现无法浏览等问题。当用户因查询信息给出 URL 中的位置，这样就不会出现重复或由于编码不统一而出现无法浏览等问题。 这里是注释 -->"。 。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
第1章 HTML 核心基础
3 1.1.3 页面渲染引擎
网页浏览器的页面渲染引擎负责取得网页的内容、整理排版以及计算网页的显示
方式，然后输出至显示器或打印机。
所有网页浏览器、电子邮件客户端以及其他需要编辑、显示网络内容的应用程序都需要页面渲染引擎，当前比较流行的页面渲染引擎有如下几种。
1．Trident 页面渲染引擎
Trident 是微软视窗操作系统（Windows）搭载的网页浏览器——Internet Explorer 的页面渲染引擎的名称，它的第一个版本诞生于1997年10月发布的Internet Explorer 第四版中，目前是互联网上非常流行的排版引擎。
目前使用Trident 渲染引擎的浏览器有Internet Explorer、360安全浏览器等。
2．Gecko 页面渲染引擎
Gecko 是开放源代码的、以C++编写的页面渲染引擎。
Gecko 是跨平台的，能在Windows、Linux 和Mac OS X 等主要操作系统上运行。
使用Gecko 页面渲染引擎的浏览器有Firefox、Mozilla 等。
3．KHTML 页面渲染引擎或WebKit 框架
KHTML 拥有速度快捷的优点，但对错误语法的容忍度则比Firefox 产品所使用的Gecko 引擎小。
苹果电脑于2002年采用了KHTML，作为开发Safari 浏览器之用。
WebCore 及WebKit 引擎均是KHTML 的衍生产品，目前使用KHTML 页面渲染引擎的浏览器有Safari、Konqueror、Google Chrome 等。
4．Presto 页面渲染引擎
Presto 是一个由Opera Software 开发的浏览器页面渲染引擎，应用于Opera 浏览器。
可见，浏览器的页面渲染引擎丰富繁杂，这对Web 前端开发提出了很大的挑战，特别是兼容性以及稳定性方面。
用户不单要熟悉每种渲染引擎和相应浏览器的特性，还需要了解它们之间的各种差异，便于设计出适合的、兼容性好的、稳定性高的系统。
1.2 HTML 开发基础
1.2.1 HTML 简介 1．什么是HTML
HTML 即“超文本标记语言”，其英文全称为Hyper Text Markup Language，是用来描述网页的一种语言规范。
通过HTML 的全称可以看出，HTML 不是一种编程语言，而是一种标记语言，由诸多不同的标签来完成网页内容的描述。
超文本标记语言是标准通用标记语言下的一个应用，也是一种规范，一种标准。
它通过标记符号来标记想要显示的网页中的各个部分。
网页文件本身是一种文本文件，通过在文本文件中添加标记符，可以告诉浏览器如何显示其中的内容（如文字如何处理、画面如何安排、图片如何显示等）。
浏览器按顺序阅读网页文件，然后根据标记符解释和显示其标记的内容，对书写出错的标记将不指出其错误，且不停止其解释执行过程，编制者只能通过显示效果来分析出错原因和出错部位。
但需要注意的是，不同的浏览器，对同一标记符可能会有不完全相同的解释，因而可能会有不同的显示效果。
2．HTML 的特点
HTML 文档制作不是很复杂，但功能强大，支持不同数据格式的文件镶入，这也是万维网（WWW）盛行的原因之一，其主要特点如下。
（1）简易性：HTML
版本升级采用超集方式，从而更加灵活方便。
V1-3 页面渲染
过程
V1-4 HTML 简介。