HTML部分基本知识提炼

最新推荐文章于 2025-08-19 15:18:40 发布

tianxieliuhong

最新推荐文章于 2025-08-19 15:18:40 发布

阅读量259

点赞数

CC 4.0 BY-SA版权

分类专栏： html 文章标签： html

本文链接：https://blog.youkuaiyun.com/tianxieliuhong/article/details/53348214

html 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了HTML的基础标签和属性，包括<base>、<meta>、<link>等元素的使用，同时深入探讨了HTML5新增的<mark>、<menu>、<nav>等标签的功能和应用场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

HTML <base> 元素

<base> 标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接:

HTML <meta> 元素

meta标签描述了一些基本的元数据。

META元素通常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据。

元数据可以使用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他Web服务。

<meta> 标签- 使用实例

为搜索引擎定义关键词:

为网页定义描述内容:

定义网页作者:

每30秒中刷新当前页面:

HTML <link> 元素

<a> 标签的 target 属性规定在何处打开链接文档。

语法

属性值

值	描述
_blank	在新窗口中打开被链接文档。
_self	默认。在相同的框架中打开被链接文档。
_parent	在父框架集中打开被链接文档。
_top	在整个窗口中打开被链接文档。
framename	在指定的框架中打开被链接文档。

HTML 文本格式化标签

标签	描述
<b>	定义粗体文本
<em>	定义着重文字
<i>	定义斜体字
<small>	定义小号字
<strong>	定义加重语气
<sub>	定义下标字
<sup>	定义上标字
<ins>	定义插入字
<del>	定义删除字

HTML "计算机输出" 标签

标签	描述
<code>	定义计算机代码
<kbd>	定义键盘码
<samp>	定义计算机代码样本
<var>	定义变量
<pre>	定义预格式文本

HTML 引文, 引用, 及标签定义

标签	描述
<abbr>	定义缩写
<address>	定义地址
<bdo>	定义文字方向
<blockquote>	定义长的引用
<q>	定义短的引用语
<cite>	定义引用、引证
<dfn>	定义一个定义项目。

定义注释

HTML 编辑器推荐

可以使用专业的 HTML 编辑器来编辑 HTML，菜鸟教程为大家推荐几款常用的编辑器：

· Notepad++：https://notepad-plus-plus.org/

· Sublime Text：http://www.sublimetext.com/

· HBuilder：http://www.dcloud.io/

你可以从以上软件的官网中下载对应的软件，按步骤安装即可。

HTML版本

从初期的网络诞生后，已经出现了许多HTML版本:

版本	发布时间
HTML	1991
HTML+	1993
HTML 2.0	1995
HTML 3.2	1997
HTML 4.01	1999
XHTML 1.0	2000
HTML5	2012
XHTML5

<!DOCTYPE> 声明

<!DOCTYPE>声明有助于浏览器中正确显示网页。

网络上有很多不同的文件，如果能够正确声明HTML的版本，浏览器就能正确显示网页内容。

doctype 声明是不区分大小写的，以下方式均可：

<!DOCTYPE html>

<!DOCTYPE HTML>

<!doctype html>

<!Doctype Html>

通用声明

HTML5

<!DOCTYPE html>

HTML 4.01

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

XHTML 1.0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

查看完整网页声明类型 DOCTYPE 参考手册。

HTML 标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

HTML 标签是由尖括号包围的关键词，比如 <html>

HTML 标签通常是成对出现的，比如 <b> 和 </b>

标签对中的第一个标签是开始标签，第二个标签是结束标签

开始和结束标签也被称为开放标签和闭合标签

<标签>内容</标签>

HTML 元素

"HTML 标签" 和 "HTML 元素" 通常都是描述同样的意思.

但是严格来讲, 一个 HTML 元素包含了开始标签与结束标签，如下实例:

HTML 元素:

<p>这是一个段落。</p>

如何使用CSS

CSS 是在 HTML 4 开始使用的,是为了更好的渲染HTML元素而引入的.

CSS 可以通过以下方式添加到HTML中:

内联样式- 在HTML元素中使用"style" 属性

内部样式表 -在HTML文档头部 <head> 区域使用<style> 元素来包含CSS

外部引用 - 使用外部 CSS 文件

最好的方式是通过外部引用CSS文件.

HTML <map> 标签

实例

带有可点击区域的图像映射：

尝试一下 »

浏览器支持

目前大多数浏览器支持 <map>标签。

标签定义及使用说明

<map> 标签用于客户端图像映射。图像映射指带有可点击区域的一幅图像。

<img>中的 usemap 属性可引用 <map> 中的 id 或 name 属性（取决于浏览器），所以我们应同时向 <map> 添加 id 和 name 属性。

area 元素永远嵌套在 map 元素内部。area 元素可定义图像映射中的区域。

HTML 4.01 与 HTML5之间的差异

注意: 在 HTML5 中, 如果 id 属性在<map> 标签中指定, 则你必须同样指定 name 属性。

HTML 与 XHTML 之间的差异

在 XHTML 中，name 属性已经废弃，使用 id 属性替换它。

HTML5 <mark> 标签

<mark> 标签定义带有记号的文本。

请在需要突出显示文本时使用 <mark> 标签。

HTML <menu> 标签

实例

两个菜单按钮系列选项实例（"File" 和 "Edit"）：

<menu type="toolbar"><li> <menu label="File"> <button type="button" onclick="file_new()">New...</button> <button type="button" onclick="file_open()">Open...</button> <button type="button" onclick="file_save()">Save</button> </menu></li><li> <menu label="Edit"> <button type="button" onclick="edit_cut()">Cut</button> <button type="button" onclick="edit_copy()">Copy</button> <button type="button" onclick="edit_paste()">Paste</button> </menu></li></menu>

· New... Open... Save

· Cut Copy Paste

<menu> 标签定义了一个命令列表或菜单。

<menu> 标签通常用于文本菜单，工具条和命令列表选项。

注意：目前主流浏览器并不支持 menu 标签。

HTML <meter> 标签

实例

使用 meter 元素展示给定的数据范围：

HTML <nav> 标签

实例

一个导航链接实例：

<nav> <a href="/html/">HTML</a> |<a href="/css/">CSS</a> |<a href="/js/">JavaScript</a> |<a href="/jquery/">jQuery</a></nav>

尝试一下 »

浏览器支持

目前大多数浏览器支持 <nav> 标签。

标签定义及使用说明

<nav> 标签定义导航链接的部分。

并不是所有的 HTML 文档都要使用到 <nav> 元素。<nav> 元素只是作为标注一个导航链接的区域。

在不同设备上（手机或者PC）可以制定导航链接是否显示，以适应不同屏幕的需求。

HTML5 不支持 <noframes> 标签。

<noframes> 元素可为那些不支持框架的浏览器显示文本。noframes 元素位于 frameset 元素内部。

<noframes> 元素插入在 <frameset> 元素中使用。

HTML 表格标签

标签	描述
<table>	定义表格
<th>	定义表格的表头
<tr>	定义表格的行
<td>	定义表格单元
<caption>	定义表格标题
<colgroup>	定义表格列的组
<col>	定义用于表格列的属性
<thead>	定义表格的页眉
<tbody>	定义表格的主体
<tfoot>	定义表格的页脚

HTML 框架

iframe语法:

该URL指向不同的网页。

Iframe - 设置高度与宽度

height 和 width 属性用来定义iframe标签的高度与宽度。

属性默认以像素为单位, 但是你可以指定其按比例显示 (如："80%").

实例

Iframe - 移除边框

frameborder 属性用于定义iframe表示是否显示边框。

设置属性值为 "0" 移除iframe的边框:

实例

使用iframe来显示目录链接页面

iframe可以显示一个目标链接的页面

目标链接的属性必须使用iframe的属性，如下实例:

实例

实体（Entities）

什么是 XHTML?

ü XHTML 指的是可扩展超文本标记语言

ü XHTML 与 HTML 4.01 几乎是相同的

ü XHTML 是更严格更纯净的 HTML 版本

ü XHTML 是以 XML 应用的方式定义的 HTML

ü XHTML 是 2001 年 1 月发布的 W3C 推荐标准

ü XHTML 得到所有主流浏览器的支持

与 HTML 相比最重要的区别：

文档结构

ü XHTML DOCTYPE 是强制性的

ü <html> 中的 XML namespace 属性是强制性的

ü <html>、<head>、<title> 以及 <body> 也是强制性的

元素语法

ü XHTML 元素必须正确嵌套

ü XHTML 元素必须始终关闭

ü XHTML 元素必须小写

ü XHTML 文档必须有一个根元素

属性语法

ü XHTML 属性必须使用小写

ü XHTML 属性值必须用引号包围

ü XHTML 属性最小化也是禁止的

<!DOCTYPE ....>是强制性的

XHTML 文档必须进行 XHTML 文档类型声明（XHTML DOCTYPE declaration）。

您可以在菜鸟教程的标签参考手册中找到完整的 XHTML 文档类型。

<html>, <head>, <title>, 和 <body> 元素也必须存在，并且必须使用 <html> 中的 xmlns 属性为文档规定 xml 命名空间。

下面的例子展示了带有最少的必需标签的 XHTML 文档：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8"> <title>文档标题</title></head> <body>文档内容</body> </html>