严格型XHTML文档头与文档结构
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<style type="text/css" media="all">
</style>
<!-- 其他文档头元素 -->
<title>文档标题</title>
</head>
<body>
</body>
</html>
通用字符实体
| 实体 | 含义 |
|---|
| " | " |
| & | & |
| < | < |
| > | > |
属性值的数据类型
[注意]所有属性值编码后的长度都不能超过
1024字节。
[释疑] 一段被
<![CDATA[ 和
]]>括起来的
CDATA节表示一段不被解析的字符数据，其中可以直接使用 " & < > 字符。
CDATA节只能出现在元素的内容中，它与属性声明中的
CDATA数据类型并无任何关系。
属性值的基本类型
| 数据类型 | 解释 |
|---|
| ID | 整个文档范围内的唯一标识符 |
| IDREF | 在文档其他位置已定义的ID类型的值 |
| IDREFS | 空格分割的已定义的ID类型的值列表 |
| NMTOKEN | 面向处理程序的XML名称(记号) |
| CDATA | 字符数据，必须对 & < 和 " 使用实体，多个空白符等价于单个空格。 |
NMTOKEN的派生类型
| 数据类型 | 解释 |
|---|
| 语言代码 | 比如："zh" "zh-CN" "zh-TW" "en-US" |
| 框架名 | 预定义名称："_blank"(新窗口) "_self"(自身) "_parent"(父窗口) "_top"(顶层窗口) ；自定义的名称不能以下划线开头。 |
CDATA的派生类型
| 数据类型 | 解释 |
|---|
| MIME类型 | 比如："text/css" "image/gif" "application/rss+xml" |
| MIME列表 | 逗号分隔的MIME类型列表。比如："text/*" "image/*,*/*" |
| 设备列表 | 逗号分隔的设备类型列表。比如："all"(所有) "screen"(屏幕) "print"(打印机) |
| 字符编码 | 比如："gb2312" "utf-8" |
| 关系列表 | 空格分隔的连接关系列表。比如："Shortcut Icon"(图标,仅用于link)
"Next"(下一个) "Prev"(上一个) "Parent"(上一级) "Start"(起点) "Contents Index"(目录
索引) "Alternate"(可替代文档) "Chapter"(章) "Section"(节) "Subsection"(子节)
"Copyright"(版权) "Glossary"(词汇表) "Help"(帮助) "Appendix"(附录) |
| URL | 比如："/new%20pricing.php?id=678" "mailto:rcpt@host?subject=sub&cc=copy@net" "javascript:fun('cc');" |
| URL列表 | 空格分割的URL列表。比如："../index.html /test.html#frag #price" |
| js脚本 | 一段JavaScript脚本。比如："window.alert("XX公司主页");" |
| 简介 | 对元素内容的摘要介绍。比如："XX公司简介" |
| 唯一字母 | 整个文档范围内的唯一小写字母。比如："a" |
| 正整数 | 一个大于零的正整数。比如："1" |
| 像素 | 以像素为单位的长度。比如："2" "523" "0" |
| 长度 | "nn"表示像素长度，"nn%"表示百分比长度(相对于包含块的高度或宽度)。比如："3" "30%" |
| 混合长度 | "nn"表示像素长度，"nn%"表示百分比长度，"n*"表示剩余空间内的相对长度。比如："3*" "*" "5*" |
| 坐标序列 | 逗号分隔的坐标序列。规则：矩形[x1,y1,x2,y2]，圆[x,y,r]，多边形[x1,y1,x2,y3,x3,y3,...,xn,yn] |
通用属性组
方框含义
| 模式 | 解释 |
|---|
| [] | 无默认值的可选属性 |
| ["???"] | 有默认值的可选属性 |
| [*] | 无默认值的必需属性 |
| [定值"???"] | 值固定的必需属性 |
%Core;(核心)
| 属性名 | 数据类型 | 解释 |
|---|
| id | ID | []为元素定义一个唯一引用名，以供 超连接、样式表、小程序、其他元素 等引用。 |
| class | CDATA | []指定元素内容的样式类。其值为用空格分隔的样式类名称列表。 |
| title | 简介 | []为元素指定一个标题。鼠标停留时会显示其内容，常作为热点帮助。 |
%Lang;(语言)
| 属性名 | 数据类型 | 解释 |
|---|
| xml:lang | 语言代码 | []指定元素内容的语言。 |
%Event;(事件)
| 属性名 | 数据类型 | 解释 |
|---|
| onclick | js脚本 | []单击事件 |
| ondblclick | js脚本 | []双击事件 |
| onmousedown | js脚本 | []按下左键事件 |
| onmouseup | js脚本 | []释放左键事件 |
| onmouseover | js脚本 | []进入元素区域事件 |
| onmousemove | js脚本 | []在元素内移动事件 |
| onmouseout | js脚本 | []离开元素区域事件 |
| onkeypress | js脚本 | []单击键盘事件 |
| onkeydown | js脚本 | []按下键盘事件 |
| onkeyup | js脚本 | []释放键盘事件 |
%Focus;(焦点)
| 属性名 | 数据类型 | 解释 |
|---|
| accesskey | 唯一字母 | []定义选中该元素的快捷键(Alt+字母) |
| tabindex | 正整数 | []使用Tab键切换焦点时的顺序 |
| onfocus | js脚本 | []获得焦点事件 |
| onblur | js脚本 | []失去焦点事件 |
%Attrs; ＝ %Core; ＋ %Lang; ＋ %Event;
通用元素组
- %inline;
- "a | br|span|object|img|map|iframe | em|strong|dfn|samp|kbd|code|var|cite|q|abbr|acronym | input|select|textarea|label|button"
- %INLINE;
- (#PCDATA | %inline; | script)*
- %block;
- "div | p | h1|h2|h3|h4|h5|h6 | ul|ol|dl | pre|blockquote|address | fieldset | table"
- %BLOCK;
- (%block; | form | script)*
- %Flow;
- (%INLINE; | %BLOCK;)
[说明]"#PCDATA" 表示文本数据，必须对其中的 & 和 < 字符使用实体。
文档结构与头部元素
| 界定文档 | %Lang; | <html> head, body </html> |
| xmlns | URL | [定值"http://www.w3.org/1999/xhtml"]本篇文档的XML命名空间 |
| 文档头 | %Lang; | <head> (meta|link|style|script|object)*, base?, title </head> |
| 文档标题 | %Lang; | <title> #PCDATA </title> |
| 文档基准 | | <base ... /> |
| href | URL | []基准URL。比如："/info/" |
| target | 框架名 | ["_self"]默认的目标框架或窗口名称 |
| 元信息 | %Lang; | <meta ... /> |
| http-equiv | CDATA | []等价HTTP头字段名称 |
| name | CDATA | []元信息的名称 |
| content | CDATA | [*]名称对应的值 |
| 补充说明 | http-equiv与name必需二选一。
http-equiv常
用："Content-Type"(MIME类型,字符编码) "Content-Language"(语言) "Refresh"(自动刷新)
"Expires"(失效时间) "Cache-Control"(缓存控制) "MSThemeCompatible"(XP主题)
"imagetoolbar"(图像工具栏) "Page-Enter"(载入特效) "Page-Exit"(退出特效)
name常
用："keywords"(关键字列表) "description"(网页描述) "author"(作者) "Copyright"(版权信息)
"revisit"(重访) "robots"(机器人指令) "abstract"(摘要) "classification"(分类)
"page-topic"(网页主题) "placename"(地名) |
| 文档关系 | %Attrs; | <link ... /> |
| href | URL | [*]目标文档 |
| rel | 关系列表 | [*]从源文档到目标文档的关系 |
| rev | 关系列表 | []从目标文档到源文档的关系 |
| hreflang | 语言代码 | []目标文档的语言 |
| charset | 字符编码 | []目标文档的字符编码 |
| type | MIME类型 | []目标文档的MIME类型 |
| media | 设备列表 | []目标文档所属设备类型 |
| 补充说明 | rel与rev属性的通常用法：
a)在文档集中导航(start, contents, prev, next, index, end, help)
c)连接到该文档的可替代版本(rel="alternate")，如：另一语言版本、RSS版本、PDF版本、打印版本 |
| 样式表 | %Lang; | <style> #PCDATA </style> |
| type | MIME类型 | [定值"text/css"] |
| media | 设备列表 | ["screen"]适用的媒体类型 |
| title | 简介 | []样式说明 |
| JS脚本 | | <script> #PCDATA </script> |
| type | MIME类型 | [定值"text/javascript"] |
| src | URL | []引用的外部javascript代码(*.js)位置 |
| charset | 字符编码 | []与src属性一起使用，指明外部js文件的字符集 |
| defer | (defer) | []指明js脚本并不修改XHTML代码，从而可推迟脚本的执行 |
| 文档体 | %Attrs; | <body> %BLOCK; </body> |
| onload | js脚本 | []文档被完全载入完毕时的事件 |
| onunload | js脚本 | []文档被卸载前的事件 |
结构元素
| 标题 | %Attrs; | <h1|h2|h3|h4|h5|h6> %INLINE; </h1|h2|h3|h4|h5|h6> |
| 水平分割线 | %Attrs; | <hr ... /> |
| noshade | (noshade) | []不显示阴影 |
| 通用结构容器 | %Attrs; | <div> %Flow; </div> |
| 段落 | %Attrs; | <p> %INLINE; </p> |
锚
| 锚 | %Attrs; %Focus; | <a> (%INLINE; - a) </a> |
| name | NMTOKEN | []锚的名称 |
| charset | 字符编码 | []所引用资源的字符编码 |
| type | MIME类型 | []所引用资源的MIME类型 |
| href | URL | []所引用资源的URL |
| hreflang | 语言代码 | []所引用资源的语言 |
| rel | 关系列表 | []从源文档到目标文档的关系 |
| rev | 关系列表 | []从目标文档到源文档的关系 |
| target | 框架名 | [base.target]目标框架或窗口名称 |
| 补充说明 | 一般放在多个元素的最内层 |
列表元素
| 有序|无序列表 | %Attrs; | <ol|ul> (li)+ </ol|ul> |
| compact | (compact) | []紧凑显示 |
| 列表项 | %Attrs; | <li> %Flow; </li> |
| 定义列表 | %Attrs; | <dl> (dt,dd*)+ </dl> |
| compact | (compact) | []紧凑显示 |
| 术语 | %Attrs; | <dt> %INLINE; </dt> |
| 解释 | %Attrs; | <dd> %Flow; </dd> |
文本元素
| 内联样式容器 | %Attrs; | <span> %INLINE; </span> |
| 地址 | %Attrs; | <address> %INLINE; </address> |
| 预格式化文本 | %Attrs; | <pre> (%INLINE; - "img|object") </pre> |
| 大块引用 | %Attrs; | <blockquote> %BLOCK; </blockquote> |
| cite | URL | []引用内容的来源 |
| 长|短内联引用 | %Attrs; | <cite|q> %INLINE; </cite|q> |
| 一般|重点强调 | %Attrs; | <em|strong> %INLINE; </em|strong> |
| 首用术语 | %Attrs; | <dfn> %INLINE; </dfn> |
| 普通|首字母缩写 | %Attrs; | <abbr|acronym> %INLINE; </abbr|acronym> |
| 样例 | %Attrs; | <samp> %INLINE; </samp> |
| 键盘输入 | %Attrs; | <kbd> %INLINE; </kbd> |
| 代码|变量 | %Attrs; | <code|var> %INLINE; </code|var> |
替换元素
| 图像 | %Attrs; | <img ... /> |
| src | URL | [*]图像文件的位置 |
| alt | 简介 | [*]图像替代文本，鼠标停留时会显示其内容 |
| longdesc | URL | []对图像进行详细描述的页面 |
| height | 长度 | []高度 |
| width | 长度 | []宽度 |
| usemap | URL | []客户端图像映射，其值为期望的<map>元素的name属性值。 |
| ismap | (ismap) | []服务端图像映射(位于<a>中)，将单击处x,y坐标发给<a>的href属性指定的处理程序。 |
| 客户端图像映射 | %Attrs; | <map> area+ </map> |
| id | ID | [*]此处id为必需属性 |
| name | NMTOKEN | [*]用来被usemap属性引用的唯一标识符 |
| 图像映射区域 | %Attrs; %Focus; | <area ... /> |
| shape | (rect|circle|poly) | ["rect"]区域形状(矩形|圆|多边形) |
| coords | 坐标序列 | []矩形:"x1,y1,x2,y2" 圆:"x,y,R" 多边形:"x1,y1,x2,y2,x3,y3,..." |
| href | URL | []该区域对应的URL |
| nohref | (nohref) | []表明没有文档与这个区域有关，单击此区域没有任何效果。 |
| alt | 简介 | [*]对该区域的简短描述，鼠标停留时会显示其内容 |
| target | 框架名 | [base.target]目标框架或窗口名称 |
| 内联框架 | %Core; | <iframe> %Flow; </iframe> |
| name | NMTOKEN | []框架的名称，将成为target属性的目标 |
| src | URL | []显示在该框架中的初始文档 |
| frameborder | (1|0) | ["1"]边框：显示|不显示 |
| scrolling | (auto|yes|no) | ["auto"]滚动条：自动|始终显示|禁止显示 |
| 嵌入对象 | %Attrs; | <object> param*, %Flow; </object> |
| declare | (declare) | []仅声明该对象而不将其实例化 |
| classid | URL | []对象的URL |
| codebase | URL | []对象源代码的URL |
| data | URL | []需要被对象处理的数据 |
| type | MIME类型 | []被处理的数据的MIME类型 |
| codetype | MIME类型 | []源代码的MIME类型 |
| archive | URL列表 | []对象所使用的资源的URL列表 |
| standby | 简介 | []对象下载完毕前显示的消息 |
| height | 长度 | []高度 |
| width | 长度 | []宽度 |
| usemap | URL | []与对象一起使用的图像映射 |
| name | NMTOKEN | []定义对象的名字 |
| tabindex | 正整数 | []使用Tab键切换焦点时的顺序 |
| 补充说明 | 嵌入Flash示例：
<object width="宽度"
height="高度" standby="对象下载完毕前显示的消息" data="swf路径"
type="application/x-shockwave-flash"
classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0">
<param name="movie" value="swf路径" />
<img src="替代GIF" />
</object> |
| 对象参数 | | <param ... /> |
| name | CDATA | [*]参数名 |
| value | CDATA | [*]参数值 |
| valuetype | (data|ref|object) | ["data"]参数值的数据类型(数据|引用|对象) |
| type | MIME类型 | []参数的MIME类型 |
表单元素
| 表单 | %Attrs; | <form> (%block; | script)* </form> |
| action | URL | [*]接收表单数据的程序 |
| method | (get|post) | ["get"]提交数据的方法，get能传递的数据长度(编码后)不超过1024字符且不能上传文件，post无此限制。 |
| enctype | MIME类型 | ["application/x-www-form-urlencoded"]另一值"multipart/form-data"仅在上传文件时使用，且此时必须用post方法。 |
| onsubmit | js脚本 | []提交数据前执行的js脚本 |
| onreset | js脚本 | []重置数据前执行的js脚本 |
| target | 框架名 | [base.target]将表单结果重定向到目标框架或窗口名称 |
| 字段组 | %Attrs; | <fieldset> legend?, %Flow; </fieldset> |
| 字段组标签 | %Attrs; | <legend> %INLINE; </legend> |
| 字段标签 | %Attrs; | <label> %INLINE; </label> |
| for | IDREF | [*]目标字段的id属性值 |
| 单行文本|密码框 | %Attrs; %Focus; | <input type="text|password" ... /> |
| name | CDATA | [*]字段名 |
| value | CDATA | [*]字段默认值 |
| disabled | (disabled) | []禁用该控件(灰显)，其值不会提交给服务器 |
| readonly | (readonly) | []其值不能被用户修改，但是其值会提交给服务器 |
| size | 正整数 | []控件长度(按字符数计算) |
| maxlength | 正整数 | []允许输入的最大字符数 |
| onselect | js脚本 | []选中事件 |
| onchange | js脚本 | []改变字段值事件 |
| 隐藏文本 | %Core; | <input type="hidden" ... /> |
| name | CDATA | [*]字段名 |
| value | CDATA | [*]字段值 |
| 文件上传 | %Attrs; %Focus; | <input type="file" ... /> |
| name | CDATA | [*]字段名 |
| value | CDATA | []文件名(含路径)默认值 |
| disabled | (disabled) | []禁用该控件(灰显)，其值不会提交给服务器 |
| readonly | (readonly) | []其值不能被用户修改，但是其值会提交给服务器 |
| size | 正整数 | []控件长度(按字符数计算) |
| onchange | js脚本 | []改变字段值事件 |
| accept | MIME列表 | []限制用户可选择的文件类型 |
| 补充说明 | 必须有 form.method="post" 和 form.enctype="multipart/form-data" |
| 单选|复选 | %Attrs; %Focus; | <input type="radio|checkbox" ... /> |
| name | CDATA | [*]字段名(单选按钮使用它进行分组) |
| value | CDATA | [*]字段值 |
| checked | (checked) | []表示默认选中 |
| disabled | (disabled) | []禁用该控件(灰显)，其值不会提交给服务器 |
| readonly | (readonly) | []其值不能被用户修改，但是其值会提交给服务器 |
| 图像提交按钮 | %Attrs; %Focus; | <input type="image" ... /> |
| name | CDATA | []字段名，浏览器会将单击处的 name.x, name.y 坐标发送给服务器 |
| disabled | (disabled) | []禁用该控件(灰显)，其值不会提交给服务器 |
| src | URL | [*]图像的URL |
| alt | CDATA | [*]替代文字 |
| 通用按钮 | %Attrs; %Focus; | <button> (%Flow - a,表单元素) </button> |
| name | CDATA | []字段名 |
| value | CDATA | []字段值(并不显示在按钮上) |
| type | (button|submit|reset) | ["submit"]按钮类型(单击|提交|重置) |
| disabled | (disabled) | []禁用该控件(灰显)，其值不会提交给服务器 |
| 选择列表 | %Attrs; %Focus; | <select> (optgroup|option)+ </select> |
| name | CDATA | [*]字段名 |
| size | 正整数 | ["1|4"]同时显示的项数，不设multiple时默认为1，反之为4 |
| multiple | (multiple) | []允许多选，不设置则为单选 |
| disabled | (disabled) | []禁用该控件(灰显)，其值不会提交给服务器 |
| onchange | js脚本 | []改变字段值事件 |
| 选项组 | %Attrs; | <optgroup> (option)+ </optgroup> |
| label | 简介 | [*]该组的标签(名称)，将会显示在每组首部 |
| disabled | (disabled) | []禁用该控件(灰显)，其值不会提交给服务器 |
| 选项 | %Attrs; | <option> #PCDATA </option> |
| value | CDATA | [#PCDATA]条目的值，默认为元素包含的文本 |
| selected | (selected) | []表示默认选中 |
| disabled | (disabled) | []禁用该控件(灰显)，其值不会提交给服务器 |
| 多行文本 | %Attrs; %Focus; | <textarea> #PCDATA </textarea> |
| name | CDATA | [*]字段名 |
| rows | 正整数 | [*]输入区域的行数 |
| cols | 正整数 | [*]输入区域的列数 |
| disabled | (disabled) | []禁用该控件(灰显)，其值不会提交给服务器 |
| readonly | (readonly) | []其值不能被用户修改，但是其值会提交给服务器 |
| onselect | js脚本 | []选中事件 |
| onchange | js脚本 | []改变字段值事件 |
表格元素
| 表格 | %Attrs; | <table> caption?, (col*|colgroup*), thead?, tfoot?, (tbody+|tr+) </table> |
| summary | 简介 | []对表格内容的摘要描述 |
| 表格标题 | %Attrs; | <caption> %INLINE; </caption> |
| 列组 | %Attrs; | <colgroup> (col)* </colgroup> |
| span | 正整数 | ["1"]该组的列数(紧接上一个列组) |
| width | 混合长度 | []宽度 |
| align | (left|center|right) | []水平对齐 |
| valign | (top|middle|bottom|baseline) | []垂直对齐 |
| 列 | %Attrs; | <col ... /> |
| span | 正整数 | ["1"]影响的列数(紧接上一个列) |
| width | 混合长度 | []宽度 |
| align | (left|center|right) | []水平对齐 |
| valign | (top|middle|bottom|baseline) | []垂直对齐 |
| 补充说明 | 仅用于不含span属性的<colgroup>元素中 |
| 表头|表脚|表正文 | %Attrs; | <thead|tfoot|tbody> (tr)+ </thead|tfoot|tbody> |
| align | (left|center|right) | []水平对齐 |
| valign | (top|middle|bottom|baseline) | []垂直对齐 |
| 补充说明 | 必需保持 头 -> 脚 -> 正文 的顺序 |
| 表格行 | %Attrs; | <tr> (th|td)+ </tr> |
| align | (left|center|right) | []水平对齐 |
| valign | (top|middle|bottom|baseline) | []垂直对齐 |
| 表头|数据单元格 | %Attrs; | <th|td> %Flow; </th|td> |
| abbr | 简介 | []单元格内容缩写 |
| axis | CDATA | []一系列空格分割关键字列表，用于形成一个查询，而单元格的内容就是查询的结果 |
| scope | (row|col|rowgroup|colgroup) | [](仅<th>)关联到<td>：所在行|所在列|行组|列组 |
| rowspan | 正整数 | ["1"]跨行数 |
| colspan | 正整数 | ["1"]跨列数 |
| nowrap | (nowrap) | []禁止换行 |
| align | (left|center|right) | []水平对齐 |
| valign | (top|middle|bottom|baseline) | []垂直对齐 |
| height | 长度 | []高度 |
| width | 长度 | []宽度 |