<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> （HTML 4.01 支持框架） <!doctype html> （HTML 5） <html> <head> <meta charset="utf-8"> <meta http-equiv="" content=""> <meta name="" content=""> <title>标题</title> <base href="所有链接的基准url" target="_blank/_self/_parent/_top/framename" /> <link href="style.css" rel="stylesheet" type="text/css" > <link rel="icon" href="favicon.ico" type="image/x-icon"> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> <script type="text/javascript" src=""></script> <style>......CSS......</style> </head> <body> <p></p> <hr /> <br /><br /><br /> <h1>….</h1> <h2>….</h2> （标记标题，1~6） <h6>….</h6> <a href="xxxxxxxx"></a> <img src="xxxxxx" width="…" height="…"/> <ul> <li></li> <li></li> </ul> <dl> <dt> <dd></dd> </dt> </dl> <form> <table> <tr> <th></th> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> </tr> </table> </form> <script type="text/javascript"> ......Script...... </script> </body> </html>
html的级关系：父级（parent） <<继承关系 子级（child）；同级（siblings）
子级浮动，父级未浮动，父级高度无法依赖子级；由父级自行解决（属性要加给父级）加上“overflow:hiddlen;”（不用设height，因为height会根据子级的高度自行调整）
宽度由父级决定，宽度尽量只给父级
内联标签不支持宽度和高度的属性
“display:block;”可以将内联标签变成块标签，或者用float也可以变成块标签
块级标签（block）
<div></div>：容器标签，特点：独占一行空间；
<h1></h1>--<h6></h6>：标题标签，特点：独占一行空间，有字体大小的设置（font-size），文本有加粗强调的设置（font-weight），上下文之间有很大的空间；
<p></p>：段落标签，特点：独占一行空间，上下文之间有一定的间距；
段落中文本的对齐方式 <p align="left/right/center/justify"></p> 建议使用CSS修饰的"text-align"替代
<dir><li>项目1</li><li>项目2</li></dir>：目录式列表，每个项目不能超过20个字元即10个中文字 （HTML5已不支持<dir></dir>标签）；
<ul><li>项目1</li><li>项目2</li></ul>：无序列表，特点：ul和li必须一起用，ul和li都独占一行空间，ul上下文之间有很大间距，li有列表的样式显示且有文本缩进（list-style）；
项目符号 <ul type="disc/circle/square"></ul>（定义全部的列举项） <li type="disc/circle/square"></li>（定义这个及其后的列举项） （HTML5已不支持该属性）
disc：实心圆点（预设）；circle：空心圆点；square：实心方块；
<ol><li>项目1</li><li>项目2</li></ol>：有序列表
<ol type="a/A/i/I/1"></ol>（定义全部的列举项） <li type="a/A/i/I/1"></li>（定义这个及其后的列举项） （HTML5已不支持该属性）
a：表示以小写英文字母作为项目编号
A：表示以大写英文字母作为项目编号
i：表示以小写罗马数字作为项目编号
I：表示以大写罗马数字作为项目编号
1：表示以阿拉伯数字作为项目编号（预设值）
<ol start="欲开始计数的序数"></ol>（定义全部的列举项） <li value="欲指定的序数"></li>（定义这个及其后的列举项） （HTML5已不支持该属性）
<ol reversed="reversed"></ol> 指定列表倒序 （HTML5新属性）
<dl><dt>项目名称1</dt><dd>描述1</dd><dd>描述2</dd><dt>项目名称2</dt><dd>描述</dd></dl>：描述性列表标签，特点：dl、dt、dd都独占一行空间，dl上下文之间有很大空间，dd有文本缩进现象；
内联标签（inline）
<span></span>：最干净的内联标签，本身无任何修饰；
<a></a>：超链接标签，链接样式由href属性决定，链接样式：文本颜色（color）、带下划线的文本修饰（text-decoration）、鼠标变成手型光标（cursor），有状态的色彩提示，点击后可跳转到对应的文件路径；
<a href="url?...&...&..." id="" title="" target="_self" download="baidu.jpg" hreflang="zh/en" media="print and (resolution:300dpi)" rel="friend" type="MIME_type"></a>
href：规定链接的目标URL，如<a href="mailto:xxx@qq.com?subject=邮件的主题"></a>
id：设定锚点，如<a id=""></a>，链接到锚点：<a href="url#..."></a>（如果锚点在另一个路径文档）<a href="#..."></a>（如果锚点在当前文档）
title：鼠标停在链接上显示的提示性文件
target：规定在何处打开链接文档；
_self：默认，在当前网页所在窗口中打开连接
_blank：打开新的浏览器窗口来显示链接目标
_parent：如果是嵌套框架，则在父框架或窗口中打开链接，如果不是则与_self等效
_top：将目标文件载入整个浏览器窗口，删除所有框架以全视窗显示
framename：框架名称，在指定框架中打开链接
download：指定被下载的链接目标，<a>标签中必须设置href属性，该属性也可以设置一个值来规定下载文件的名称。所允许的值没有限制，浏览器将自动检测正确的文件扩展名并添加到文件 (.img, .pdf, .txt, .html, 等等)
hreflang：规定被链接文档的语言，<a>标签中必须设置href属性
media：规定目标 URL 是为什么类型的媒介/设备进行优化的，该属性用于规定目标 URL 是为特殊设备（比如 iPhone）、语音或打印媒介设计的，该属性可接受多个值，只能在 href 属性存在时使用；
可用运算符：“and”、“not”、“,”（or）
设备：all（默认）、aural（语音合成器）、braille（盲文反馈装置）、handheld（手持设备，小屏幕，有限的带宽）、projection（投影机）、print（打印预览模式/打印页面）、screen（计算机屏幕）、tty（电传打字机以及使用等宽字符网格的类似媒介）、tv（电视类型设备，低分辨率、有限的分页能力）
值：width（规定目标显示区域的宽度，可使用 "min-width" 和 "max-width"）、height（规定目标显示区域的高度，可使用 "min-height" 和 "max-height"）、device-width（规定目标显示器/纸张的宽度，可使用 "min-" 和 "max-" 前缀）、device-height（规定目标显示器/纸张的高度，可使用 "min-" 和 "max-" 前缀）、orientation（规定目标显示器/纸张的取向，可能的值："portrait" 或 "landscape"）、aspect-ratio（规定目标显示区域的宽度/高度比）、device-aspect-ratio（规定目标显示器/纸张的 device-width/device-height 比率）、color（规定目标显示器的 bits per color）、color-index（规定目标显示器能够处理的颜色数）、monochrome（规定在单色帧缓冲中的每像素比特）、resolution（规定目标显示器/纸张的像素密度 dpi/dpcm）、scan（规定 tv 显示器的扫描方法，可能的值是："progressive" 和 "interlace"）、grid（规定输出设备是网格还是位图，可能的值："1" 代表网格，"0" 是其他）
rel：指定当前文档与被链接文档的关系，只能在 href 属性存在时使用；
alternate：文档的可选版本（例如打印页、翻译页或镜像）
stylesheet：文档的外部样式表
start：集合中的第一个文档
next：集合中的下一个文档
prev：集合中的前一个文档
contents：文档目录
index：文档索引
glossary：文档中所用字词的术语表或解释
copyright：包含版权信息的文档
chapter：文档的章
section：文档的节
subsection：文档的子段
appendix：文档附录
help：帮助文档
bookmark：相关文档
nofollow：Google 使用 "nofollow"，用于指定 Google 搜索引擎不要跟踪链接
licence、tag、friend
type：规定目标文档的MIME类型，只能在 href 属性存在时使用；
单标签（元素标签）
<img src="图像文件地址" alt="图像不显示时显示的文本" title="鼠标经过图像时的提示" /> 插入图像标签
<input type="" /> 输入标签
<hr />水平横线
<br />换行符
合理化使用标签：
1、尽量用块来包含内联
2、在无法确定使用哪个标签时就用<div>
3、通常有宣传意义的图用<img>标签，只是为了修饰而存在的用背景图background-image
4、横向导航常用无序列表（ul、li）进行布局
5、竖向导航常用菜单列表（dl、dt、dd）
6、用语义的方式来安排标签，建议在<div>内包含<h1>或<p>标签来布局（尽量把div作为布局父元素来使用）