1.meta标签
关键字：keywords
简介：description
设置网页刷新时间：refresh
<meta name="keywords" content="关键词1，关键词2..." >
<meta name="description" content="描述内容..." >
<meta http-equiv="refresh" content="30" >
2.字符编码格式
UTF-8：收录了全世界所有语言的文字，存储一个汉字占3个字节
GBK：存储一个汉字占2个字节，是国际标准
GB2313：收录了汉字、片假名，是国际标准的扩展
3.常用特殊字符
"<"：<
">"：>
"&"：&
" "： 
商标：©
4.标签语义化
语义化标签：那些可以看出意思的标签名，如：header、footer等
非语义化标签：div等
5.行内元素与块级元素嵌套
同级标签必须要同类型，即块级元素与块级元素并列，行内元素与行内元素并列；
块级元素可以嵌套行内元素，行内元素不能嵌套块级元素，例外：h1-h6、p、dt是块级元素，但它们都不能嵌套块级元素；
li可以嵌套div或者其他块级元素，因为li和div都是装载内容的标签，没有级别之分；
6.锚点
href里的值可以为#或者""，都是跳转回页面头部；
#ID：跳转到id名为ID的元素处；
7.CSS3选择器
nth-child（）：不区分标签类别，例如：
<div>
<div></div>
<p></p>
</div>
div p:nth-child(1){
}
div p:nth-of-type(1){
}
这里第一种选择器只能选择到div里面的第一个div标签，
第二中才可以选择到里面的p
8.input的list属性
list主要输入框的历史记录提示文本，适用于以下input类型：text、search、url、telephone、email、data picker、number、range、color
<input type="text" id="list" list="datalists" >
<datalist id="datalists">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</datalist>
9.min、max 和 step 属性
适用于可以表示数值的input类型，例如number、range
<input type="range" min="0" max="50" step="5" />
<input type="number" min="0" max="10" step="2" />
10.行内元素与块级元素
行内元素：a,b,strong,span,img,label,button,input,select,textarea等
块级元素：header,form,ul,ol,table,div,hr,figure,footer等
行内元素可以在一行内显示多个，从左到右排列，块级元素独占一行，紧跟在其后的标签自动换行。
11.font标签
有以下几种属性：size（设置字体大小）、face（设置字体）、color；
font标签在h5中已经被废弃
12.表格
cellpadding属性：设置表格的内边距；
cellspacing属性：设置表格与表格之间的距离；
border属性：设置表格的边框大小；
rowspan：合并行；
colspan：合并列；
还有width、height、bordercolor、align等属性；
还有th标签、caption、thead、tbody、tfoot等标签；
注意：不要随意用表格进行网页布局，会影响浏览器的渲染。
13. H5 一些特性总结
1.最新版本的safari、firefox、chrome等都已兼容HTML5，IE在IE9之后兼容，IE9之前，可以使用菜鸟教程的静态资源包html5shiv：
<script src="http://cdn.static.runoob.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
2.所有浏览器，最旧的或者最新的，对无法识别的HTML元素会作为内联元素处理。
3.HTML5的新元素都是块状元素，要是旧的浏览器支持HTML5，可以把其CSS的display属性设置为block：
header,section,footer,aside,nav,main,article,figure {display:block}
4.<filedset></filedset> 用于给表单的某组元素分组，且会在分组周围绘制边框，<legend></legend>是这个分组的标题
栗子：
<form method="post" action="/projects/1">
<fieldset id="personal_information">
<legend>Project Information</legend>
<ol>
<li>
<label for="name">Name</label>
<input type="text" name="name" id="name">
</li>
<li>
<input type="submit" value="Submit">
</li>
</ol>
</fieldset>
</form>
效果图：
5.autofocus属性：<input type="text" name="name" autofocus id="name">这个input输入框自动获得光标，其回退方案：
if (!Modernizr.autofocus){
$('input[autofocus]').focus();
}
6.使用Modernizr检测特性
Modernizr库可以用来检测浏览器对众多HTML5和CSS3特性的支持情况。
它并不添加缺失功能，但提供检测方式，比我们自己实现的更强壮。
14. H5 注意事项
HTML5声明(写在所有标签的最前面)： <!DOCTYPE html>
防止中文乱码，在头部： <meta charset="utf-8">
在W3C万维网联盟中推荐使用小写标签名，在XHTML中强制使用小写标签。属性和属性名同理
改掉用标题标签达到使字体变粗或者大写的目的，浏览器根据标题标签为网页编排索引。
<pre></pre>：在这个标签中，文本的换行和空格都会被保留。
<abbr title="chenwenchun">cwc</abbr>：把鼠标停留在cwc上会显示chenwenchun。
<bdo dir="ltr"></bdo>:可以改变文字显示方向。
<del></del>、<ins></ins> :文字删除效果、下划线效果。
<a id="tips">有用的提示部分</a>
在HTML文档中创建一个链接到"有用的提示部分(id=“tips”）"：
<a href="#tips">访问有用的提示部分</a>
或者，从另一个页面创建一个链接到"有用的提示部分(id=“tips”）"：
<a href="http://www.runoob.com/html/html-links.html#tips"> 访问有用的提示部分</a>
<meta http-equiv="refresh" content="30">：每隔30秒刷新网页。
设置某图像的可点击区域：
<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap"> <map name="planetmap"> <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm"> <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm"> <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm"> </map>
<iframe></iframe> ：在一个网页显示另一个网页的内容。
<strong></strong>
<em></em>
2145
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
