HTML语言基础之——掌握HTML的写法(3)
04、常见HTML元素
前面已经提到了<p>、<em><h1>、<h2>等元素，现在有必要给元素分下类了。元素通常可以分为三类：
- 块级元素：h1、p
- 内联元素：em
- 不可见元素：title
|
元素 |
全称 |
类别 |
典型视觉效果 |
结束标签是否可省略 |
空元素或置换元素 |
|
A |
Anchor |
内联元素 |
突出 |
否 |
|
|
Block-Quote |
|
块级元素 |
缩进 |
否 |
|
|
Body |
|
块级元素 |
画布内 |
是 |
|
|
Br |
Break |
块级元素 |
换行 |
是* |
空元素 |
|
DD |
Definition Description |
块级元素 |
|
是 |
|
|
DL |
Definition list |
块级元素 |
|
否 |
|
|
Div |
Definition term |
块级元素 |
|
是 |
|
|
EM |
Emphasis |
内联元素 |
斜体 |
否 |
|
|
H1，H2，…，H6 |
Heading levels |
块级元素 |
大字体 |
否 |
|
|
Hr |
Horizontal rule |
块级元素 |
水平 |
是* |
空元素 |
|
Html |
|
块级元素 |
|
是 |
|
|
I |
Italic |
内联元素 |
斜体 |
否 |
|
|
IMG |
Image |
内联元素 |
图片格式 |
是* |
空元素、置换元素 |
|
Li |
List item |
块级元素 |
前面标记列表项 |
是 |
|
|
Link |
|
不可见元素 |
|
是* |
空元素 |
|
Object |
|
块级元素 |
|
否 |
置换元素 |
|
OL |
Orderd list |
块级元素 |
|
否 |
|
|
P |
Paragraph |
块级元素 |
|
是 |
|
|
PRE |
Preformatted |
块级元素 |
等宽字体 |
否 |
|
|
Span |
|
内联元素 |
|
否 |
|
|
Strong |
|
内联元素 |
粗体 |
否 |
|
|
Style |
|
不可见元素 |
|
否 |
|
|
Title |
|
不可见元素 |
显示在标题栏，而非画布 |
否 |
|
|
TT |
Teletypt |
内联元素 |
等宽字体 |
否 |
|
|
UL |
Unordered list |
块级元素 |
|
否 |
|
（*为既是空元素又没有结束标签）
（注意两个概念：空元素：无内容的元素。置换元素：元素指向内容的一个占位符。）
04、文档类型声明
如果不指定文档类型，你的HTML不是合法的HTML，并且大部分浏览器会用“怪癖模式（quirks mode）”来处理页面，这意味着浏览器认为你自己也不知道究竟做什么，并且按浏览器自己的方式来处理你的代码。
在HTML3.2以后，HTML文件的开头都要用<!DOCTYPE>来标记，（构建符合标准的网页中）只有确定正确的DOCTYPE（Document Type，文档类型），HTML文档的结构和样式才能被正常解析和呈现。这便是“文档类型声明”（表示文件使用那种HTML或XHTML样式写的）。
DOCTYPE声明必须放在（X）HTML文档的顶部，在文档类型声明语句的上面不能够包含任何HTML代码，包括HTML注释标记都不行。
格式：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
或
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
解释：
（注意：XHTML 1.0与 HTML 4.01 标准没有太多的不同，但XHTML 大小写敏感；如果您要使用CSS，那就使用前者吧。）
HTML文档类型也有分类：
- 过渡型（Transitional）
- 严格型（Strict）
- 框架型（Frameset）
在严格型文档类型中，以下元素将不被支持：
center 、font 、strike、s、u、iframe、isindex（与input元素语义重复）、dir、menu、basefont、applet（与object元素语义重复）
在严格型文档类型中，以下属性将不被支持：
align、language、background、bgcolor、border（table元素支持）、height（img和object元素支持）、hspace、name（在HTML 4.01 Strict中支持，XHTML 1.0 Strict中的form和img元素不支持）、noshade、nowrap、target、text、link、vlink和alink、vspace、width（img、object、table、col和colgroup元素支持）
05、添加追加信息
在HTML文档结构的头部区域，存储着文件的相关信息，这些信息主要被浏览器所采用，不会显示在网页正文中。
<meta>标签编写在<head></head>之间，用来给页面添加诸如作者相关信息、制作日期、页面（文件）等网页的相关信息，即网页元信息。
格式：如定义网页的描述信息，定义页面关键字：
<meta name="description" content="网页设计" />
<meta name="keywords" content="HTML, DHTML, CSS, XML, XHTML, JavaScript" />
分析：
在编写<meta>标签时，先设定一套“name”属性和“content”属性，在name属性中展示某种信息，在content属性中对这一信息的具体内容进行编写。
常用属性：
author 网页作者
copyright copy right
reply-to 联系地址
build 制作日期
expires 失效日期
在HTML文件保存时，为防止出现乱码现象，通常要在文件内指定文字编码，也是用的<meta>标签，格式如下：
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
（注意：<meta>没有结束标签。meta表示关于（about）的意思，以meta作为前缀可以表示很多特殊的语义。例如，metadata表示关于数据的数据，用英文表示为data about data；而metalanguage则表示一种描述其它语言的语言。）
06、添加页面标题
<title>标签也编写在<head></head>之间，用来给页面添加标题。<title>标签里的内容将显示在浏览器的Title bar里面，也将显示在book mark、搜索引擎搜索出的结果及taskbar里面。
例子：网页中显示
实际的HTML文件：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="zh-cn">
<head>
<title>诗词欣赏：孟浩然诗《宿建德江》</title>
<meta http-equiv=Content-Type content="text/html; charset=gb2312">
<meta name="description" content="诗词欣赏" />
<meta name="build" content="2011.9.6" />
<body>
<h1 align="center">孟浩然诗：宿建德江</h1>
<h2 align="right" >孟浩然</h2>
<p align="left" style="FONT-FAMILY: 幼圆; FONT-SIZE: 24px;">
移舟泊烟渚，<em>日暮客愁新</em>。<BR/>
野旷天低树，江清月近人。</p>
</body>
</html>
07、编写无法在浏览器上显示的信息
用<!--和-->标签（通常叫做“内容标签”）括起来的内容将无法在浏览器上显示。这些信息通常是文件主题的意义、内容，作者的备忘录，文件未完成的部分，临时不想显示的部分等等。
例如：
最后：别忘了检验标签是不是已经成为“套盒”了（HTML的标签互相之间要一致），别忘了HTML的编写要使用小写字母。
