HTML详细介绍（基础标签篇）

今天下午阳光明媚，北京少有的好天气。正好有机会总结HTML标签，下面就详细介绍一下基础的标签的用法及相关的属性。关于基础篇的总结部分点击这里.

基础标签的内容

<!DOCTYPE>：定义，声明文档类型
<html>：html文档的根节点，定义html文档
<title>：定义文档的标题
<body>：定义文档的主体
<h1> -- <h6>：定义html的标题
<p>：定义html段落
<br>：定义一个简单的换行
<hr>：定义一条水平线
<!--...-->：html文档的注释

基础标签的使用方式

<!DOCTYPE html>
<html>
<head>
  <title>这里是标题</title>
  这里是文档的头部 ... ...
  ...
</head>
<body>
  这里是文档的主体 ... ...
  ...
</body>
</html>

<!DOCTYPE>：文档声明

定义和用法
定义：<!DOCTYPE>是指示浏览器使用哪个HTML版本渲染编写的代码
用法：必须是 HTML 文档的第一行，位于 <html> 标签之前。

在在 HTML 4.01 中，<!DOCTYPE> 声明引用 DTD（文档类型定义），因为 HTML 4.01 基于 SGML（标准通用标记语言）。DTD 规定了标记语言的规则，这样浏览器才能正确地呈现内容。
HTML5 不基于 SGML，所以不需要引用 DTD。

以下是HTML的DOCTYPE文档类型的常见声明:

HTML 5

 <!DOCTYPE html>

HTML 4.01 Strict（严格的）
该 DTD 包含所有 HTML 元素和属性，但不包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。

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

HTML 4.01 Transitional（过渡的）
该 DTD 包含所有 HTML 元素和属性，包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。

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

HTML 4.01 Frameset
该 DTD 等同于 HTML 4.01 Transitional，但允许框架集内容。

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

XHTML 1.0 Strict（严格的）
该 DTD 包含所有 HTML 元素和属性，但不包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。必须以格式正确的 XML 来编写标记。

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

XHTML 1.0 Transitional（过渡的）
该 DTD 包含所有 HTML 元素和属性，包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。必须以格式正确的 XML 来编写标记。

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

XHTML 1.0 Frameset
该 DTD 等同于 XHTML 1.0 Transitional，但允许框架集内容。

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

XHTML 1.1
该 DTD 等同于 XHTML 1.0 Strict，但允许添加模型（例如提供对东亚语系的 ruby 支持）。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html>：html文档的根节点，定义html文档

定义和用法
定义：此元素可告知浏览器其自身是一个 HTML 文档。
用法：<html> 与 </html> 标签限定了文档的开始点和结束点，在它们之间是文档的头部和主体。正如您所了解的那样，文档的头部由<head>定义，而主体由<body>定义。

HTML 与 XHTML 之间的差异
1.XHTML 要求正确嵌套
2.XHTML 所有元素必须关闭
3.XHTML 区分大小写
4.XHTML 属性值要用双引号
5.XHTML 用 id 属性代替 name 属性
6.XHTML 特殊字符的处理

<title>：定义文档的标题

定义和用法
定义：<title> 元素可定义文档的标题。
用法：放在<head>标签中
通常把它放置在浏览器窗口的标题栏或状态栏上，并且，当把文档加入用户的链接列表或者收藏夹或书签列表时，标题将成为该文档链接的默认名称

<body>：定义文档的主体

定义和用法
定义：body 元素定义文档的主体。
用法：在<html>标签中，与<title>标签是兄弟节点

可选的属性(不推荐使用)
align="left/center/right/justify"

h1 -- h6：定义html的标题

有6级标题，每级标题有对应的字体格式，具体的大小，参见这里;

p 定义段落

p 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间，您也可以在样式表中规定。

br 换行

p 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间，您也可以在样式表中规定。

定义水平线

标签在 HTML 页面中创建一条水平线。
水平分隔线（horizontal rule）可以在视觉上将文档分隔成各个部分。

属性="属性值"
noshade="noshade"：规定水平线的颜色为纯色，不是有阴影的颜色；
size="num"：规定水平线的高度，以px为单位；
width="num"：规定水平线的宽度，以px或百分比为单位；

：html文档的注释

注释标签用于在源代码中插入注释。注释不会显示在浏览器中。