HTML标签速记整理W3C
段落
链接< href="">图像自关闭元素，不需要结束标记换行标志
HTML 元素以开始标签起始HTML 元素以结束标签终止HTML 文档由嵌套的 HTML 元素（可以包含其他 HTML 元素）构成
标题 <h1>
段落<p>
链接< href="">
图像<img src="">自关闭元素，不需要结束标记
换行标志<br>
html 元素以开始标签起始
html 元素以结束标签终止
html 文档由嵌套的 html 元素（可以包含其他 html 元素）构成
<html>
<head>
<meta charet="utf-8">
<title>页面标题</title>
</head>
<body>
<h1>标题<\h1>
<p>段落<\p>
<\body>
<\html>
标签包含了文档的元（meta）数据，如<meta charset="utf-8">定义网页编码格式为utf-8。
<title>标签定义文档的标题
<body> 标签定义文档的主体，即网页可见的页面内容，该标签的结束标志为 </body>
<h1> 标签作为一个标题使用，该标签的结束标志为 </h1>，--html标题
<p> 标签作为一个段落显示，该标签的结束标志为 </p>
html 空元素
空元素即没有内容的html
对大小写不明确
html属性：提供附加信息
<a href="http://www.w3cschool.cn">这是一个链接</a>
class 为html元素定义一个或多个类名 类名能在样式文件中引入
id 定义元素的唯一id
style 规定元素的行内样式
title 描述了元素的额外信息 (作为工具条使用) 更多属性如下表
属性 描述
accesskey 设置访问元素的键盘快捷键。
class 规定元素的类名（classname）
contenteditablenew 规定是否可编辑元素的内容。
contextmenunew 指定一个元素的上下文菜单。当用户右击该元素，出现上下文菜单
data-*new 用于存储页面的自定义数据
dir 设置元素中内容的文本方向。
draggablenew 指定某个元素是否可以拖动
dropzonenew 指定是否将数据复制，移动，或链接，或删除
hiddennew hidden 属性规定对元素进行隐藏。
id 规定元素的唯一 id
lang 设置元素中内容的语言代码。
spellchecknew 检测元素是否拼写错误
style 规定元素的行内样式（inline style）
tabindex 设置元素的 tab 键控制次序。
title 规定元素的额外信息（可在工具提示中显示）
translatenew 指定是否一个元素的值在页面载入时是否需要翻译
<body> 标签表示 html 网页的主体部分，该标签内的内容使用户可以看到的。
一个 html 文件只能存在一个 <body> 标签。
标题是 <h1>
段落是<p>this is another paragraph</p>
<p style="font-family:times;color:green">
属性 描述
align 定义文本的对齐方式
bgcolor 定义背景颜色
color 定义文本颜色
文本格式化标签
标签 描述
<b> 定义粗体文本。
<big> 定义大号字。
<em> 定义着重文字。
<i> 定义斜体字。
<small> 定义小号字。
<strong> 定义加重语气。
<sub> 定义下标字。
<sup> 定义上标字。
<ins> 定义插入字。
<del> 定义删除字。
<s> 不赞成使用。使用 <del> 代替。
<strike> 不赞成使用。使用 <del> 代替。
<u> 不赞成使用。使用样式（style）代替。
eg.
<html>
<body>
这是长的引用：
<blockquote>
这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。
</blockquote>
这是短的引用：
<q>
这是短的引用。
</q>
<p>
使用 blockquote 元素的话，浏览器会插入换行和外边距，而 q 元素不会有任何特殊的呈现。
</p>
</body>
</html>
外部样式表
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
内部样式表
当单个文件需要特别样式时，就可以使用内部样式表。你可以在 head 部分通过 <style> 标签定义内部样式表。
<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>
内联样式
当特殊的样式需要应用到个别元素时，就可以使用内联样式。 使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 css 属性。以下实例显示出如何改变段落的颜色和左外边距。
<p style="color: red; margin-left: 20px">
this is a paragraph
</p>
<a href="url">link text</a>
首先，我们在 html 文档中对锚进行命名（创建一个书签）：
<a name="tips">基本的注意事项 - 有用的提示</a>
然后，我们在同一个文档中创建指向该锚的链接：
锚点跳转
<a href="#tips">有用的提示</a>
您也可以在其他页面中创建指向该锚的链接：
<a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a>
在指定位子插入图片
<html>
<body>
<p>
来自另一个文件夹的图像：
<img src="/i/ct_netscape.jpg" />
</p>
<p>
来自 w3school.com.cn 的图像：
<img src="http://www.w3school.com.cn/i/w3school_logo_white.gif" />
</p>
表格
表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
</body>
</html>
无序列表
无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。
无序列表始于 <ul> 标签。每个列表项始于 <li>。
<ul>
<li>coffee</li>
<li>milk</li>
</ul>
有序是<ol>
html 块元素<h1>, <p>, <ul>, <table>
html 内联元素
内联元素在显示时通常不会以新行开始。
例子：<b>, <td>, <a>, <img>
html <div> 元素
html <div> 元素是块级元素，它是可用于组合其他 html 元素的容器。
<div> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。
如果与 css 一同使用，<div> 元素可用于对大的内容块设置样式属性。
<div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 <table> 元素进行文档布局不是表格的正确用法。<table> 元素的作用是显示表格化的数据。
使用 <div> 元素的 html 布局
注释：<div> 元素常用作布局工具，因为能够轻松地通过 css 对其进行定位。
这个例子使用了四个 <div> 元素来创建多列布局：