1
html(超文本标记语言由浏览器解析‘prase‘)
对于中文网页需要使用 <meta charset="utf-8"> 声明编码，否则会出现乱码。有些浏览器会设置 GBK 为默认编码，则你需要设置为 <meta charset="gbk">。
GBK包含全部中文字符；UTF-8则包含全世界所有国家需要用到的字符。
GBK是在国家标准GB2312基础上扩容后兼容GB2312的标准（好像还不是国家标准）
UTF-8编码的文字可以在各国各种支持UTF8字符集的浏览器上显示。
比如，如果是UTF8编码，则在外国人的英文IE上也能显示中文，而无需他们下载IE的中文语言支持包。 所以，对于英文比较多的论坛 ，使用GBK则每个字符占用2个字节，而使用UTF－8英文却只占一个字节。
UTF8是国际编码，它的通用性比较好，外国人也可以浏览论坛，GBK是国家编码，通用性比UTF8差，不过UTF8占用的数据库比GBK大~
HTML 不是一种编程语言，而是一种标记语言
HTML 是用来描述网页的一种语言。
HTML 指的是超文本标记语言: HyperText Markup Language
HTML 不是一种编程语言，而是一种标记语言
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页
HTML 文档包含了HTML 标签及文本内容
HTML文档也叫做 web 页面
"HTML 标签" 和 "HTML 元素" 通常都是描述同样的意思.
但是严格来讲, 一个 HTML 元素包含了开始标签与结束标签，如下实例
2
可以使用专业的 HTML 编辑器来编辑 HTML，菜鸟教程为大家推荐几款常用的编辑器：
Notepad++：https://notepad-plus-plus.org/
Sublime Text：http://www.sublimetext.com/
HBuilder：http://www.dcloud.io/
每一种操作系统都带有简单的文本编辑器：
Windows 用户可以使用记事本；
Linux 用户可以选择几种不同的文本编辑器，如 vi、vim 或者 emacs ；
Mac 用户可以使用 OS X 预装的 TextEdit。
3
经过亲自测试得出:
浏览器默认为body:100%=16px;
浏览器计算得出
h1=32px
h2=24px
h3=18.72px
h4=16px
p=16px
h5=13.28px
h6=12px
font-size尺寸指的是他的高还是宽:
不是宽也不是高也不是对角线，他是一种长度单位，依赖设备的的dpi，而字体渲染是另外一码事。
打个比方厘米，你说是宽呢还是高呢？
4
默认
注意：浏览器会自动地在段落的前后添加空行。（</p> 是块级元素）
5
<br>单个是换行，多个出现空行
6
<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>
这里的del是删除标签--出现了在文字中间；<ins>标签是插入标签，出现了underline;
My favorite color is blue red!
7
HTML "计算机输出" 标签:::
<code> 定义计算机代码-----单行
<kbd> 定义键盘码
<samp> 定义计算机代码样本
<var> 定义变量
<pre> 定义预格式文本-------预留空格文本，可以多行；
按照惯例，引用的文本将以斜体显示。
用<cite>标签把指向其他文档的引用分离出来，尤其是分离那些传统媒体中的文档，如书籍、杂志、期刊等。如果引用的这些文档有联机版本，
最好是把该引用包含于一个a元素中，从而把一个超链接指向该联机版本。
<cite>标签还有一个隐藏功能：它可以使你或者其他人从文档中自动摘录参考书目。
可以很容易想象一个浏览器，它能够自动整理引用表格，并把它们作为脚注或者独立的文档来显示。
8
d属性可用于创建在一个HTML文档书签标记。
提示: 书签是不以任何特殊的方式显示，在HTML文档中是不显示的，所以对于读者来说是隐藏的。
（您可以使用 id 属性来替代 name 属性，命名锚同样有效。[1]）
在标签<a> 中使用了href属性来描述链接的地址。
默认情况下，链接将以以下形式出现在浏览器中：
一个未访问过的链接显示为蓝色字体并带有下划线。
访问过的链接显示为紫色并带有下划线。
点击链接时，链接显示为红色并带有下划线。
注意：如果为这些超链接设置了 CSS 样式，展示样式会根据 CSS 的设定而显示。
9
<base> 标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接:
<base href="http://www.runoob.com/images/" target="_blank">
<meta> 标签- 使用实例-----name,http-equiv,:http://www.jb51.net/web/70787.html
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
<meta name="description" content="免费 Web & 编程 教程">
<meta name="author" content="Runoob">
<meta http-equiv="refresh" content="30">
10
CSS (Cascading Style Sheets) 用于渲染HTML元素标签的样式.
在HTML 4, 原来支持定义HTML元素样式的标签和属性已被弃用。这些标签将不支持新版本的HTML标签。
不建议使用的标签有: <font>, <center>, <strike> <strike>仍然支持</strike>已经不支持这个标签了。--删除线
不建议使用的属性: color 和 bgcolor.
<body bgcolor="#E6E6FA"> ---bgcolor是属性；
11
注意: 假如某个 HTML 文件包含十个图像，那么为了正确显示这个页面，需要加载 11 个文件。
加载图片是需要时间的，所以我们的建议是：慎用图片。
他的属性align="middle" .......left,top,等
border，边框属性；
12
<img> 定义图像
<map> 定义图像地图
<area> 定义图像地图中的可点击区域
<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>
1、距形：(左上角顶点坐标为(x1,y1)，右下角顶点坐标为(x2,y2))
<area shape="rect" coords="x1,y1,x2,y2" href=url>
2、圆形：(圆心坐标为(X1,y1)，半径为r)
<area shape="circle" coords="x1,y1,r" href=url>
3、多边形：(各顶点坐标依次为(x1,y1)、(x2,y2)、(x3,y3) ......)
<area shape="poly" coords="x1,y1,x2,y2 ......" href=url>
13
<caption>表格的标题
<table border="1">
<tr>
<td>Row 1, cell 1</td>
<td>Row 1, cell 2</td>
</tr>
</table>
如果不定义边框属性，表格将不显示边框。有时这很有用，但是大多数时候，我们希望显示边框。
使用边框属性来显示一个带有边框的表格：
跨行或跨列的表格单元格：
<th colspan="2">Telephone</th>---跨行
<th rowspan="2">Telephone:</th>---夸列
table 里可以嵌套
vertical-align垂直属性对齐
<table border="1"
cellpadding="10">-----单元格边距(Cell padding)
<table border="1" cellspacing="0">-----单元格间距(Cell spacing)
<colgroup> 定义表格列的组
<col> 定义用于表格列的属性
<col span="2" style="background-color:red">
<col style="background-color:yellow">
14
HTML 自定义列表
自定义列表不仅仅是一列项目，而是项目及其注释的组合。
自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。
<ol type="a A 罗马字母的大小写 ">type是 列表的属性
<ul style="list-style-type:disc"> circle square
15
内联元素在显示时通常不会以新行开始。
实例: <b>, <td>, <a>, <img>
<div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。
使用 <table> 元素进行文档布局不是表格的正确用法。<table> 元素的作用是显示表格化的数据。
HTML <span> 元素是内联元素，可用作文本的容器
<span> 元素也没有特定的含义。
当与 CSS 一同使用时，<span> 元素可用于为部分文本设置样式属性。
16表单
HTML <optgroup> 标签
<select>
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars" disabled>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
label 属性为选项组规定描述标签。
disabled 属性是一个布尔属性。
disabled 属性规定选项组应该被禁用。
<select>的属性
autofocusNew autofocus 规定在页面加载时下拉列表自动获得焦点。
disabled disabled 当该属性为 true 时，会禁用下拉列表。
formNew form_id 定义 select 字段所属的一个或多个表单。
multiple multiple 当该属性为 true 时，可选择多个选项。
name name 定义下拉列表的名称。
requiredNew required 规定用户在提交表单前必须选择一个下拉列表中的选项。
size number 规定下拉列表中可见选项的数目。
17框架
使用 iframe 作为链接的目标
iframe 可用作链接的目标（target）。
链接的 target 属性必须引用 iframe 的 name 属性：
<iframe src="demo_iframe.htm" width="200" height="200"></iframe>
框架结构标签（<frameset>）
框架结构标签（<frameset>）定义如何将窗口分割为框架
每个 frameset 定义了一系列行或列
rows/columns 的值规定了每行或每列占据屏幕的面积
编者注：frameset 标签也被某些文章和书籍译为框架集。
18颜色
HTML 颜色由一个十六进制符号来定义，这个符号由红色、绿色和蓝色的值组成（RGB）。
每种颜色的最小值是0（十六进制：#00）。最大值是255（十六进制：#FF）。
（1600万种不同颜色：256 x 256 x 256)
rgba(255,255,0,0.5)可以实现设置颜色透明度的功能，这里的0.5表示透明度，范围0~1。
颜色名：antique white --古董白
coral 珊瑚的；珊瑚色的
yellowgreen:黄绿；
Violet 紫罗兰；
brown:n. 褐色，棕色
navy:深蓝色；海军；DarkBlue ：深蓝色；
teal:鸭子，青色；
19脚本
<script>
document.write("Hello World!")
</script>
<noscript>抱歉，你的浏览器不支持 JavaScript!</noscript>-----为了 不支持脚本的浏览器应用
提示：如果浏览器支持脚本，那么它不会显示出 noscript 元素中的文本。
19
<object> 标签用于包含对象，比如图像、音频、视频、Java applets、ActiveX、PDF 以及 Flash。
20URL
21
<a href="mailto:[email protected]?subject=test&[email protected]&body=use mailto sample">send mail</a>
mailto后跟的是收信人。
可使用参数列表
to 收信人
suject 主题
cc 抄送
bcc 暗抄送
body 内容
22国际标准化组织---ISO----ISO 639-1 为各种语言定义了缩略词。您可以在 HTML 和 XHTML 中的 lang 和 xml:lang 属性中使用它们。
写在html标签中的lang属性作用：声明当前页面的语言类型。
如：
<html lang=‘en‘></html> //英文
1
<html lang=‘zh‘></html> //中文
1
<html lang=‘ja‘></html> //日文
1
<html lang=‘en-us‘></html> //美式英文
23HTTP 状态消息
以下列举了有可能会返回的一系列 HTTP 状态消息：
2xx: 成功
4xx: 客户端错误
5xx: 服务器错误
24
两种最常用的 HTTP 方法是：GET 和 POST。
超文本传输协议（HTTP）的设计目的是保证客户端与服务器之间的通信。
25
下表列出了在网页字体默认值为 16px 时， px 和 em 及网页字体百分比的换算数据。
26IE浏览器
技术含量最高的是IE10，性能最好的是IE9，国内使用人数最多的是IE7、8，
因为国内大多数还是XP。而且盗版居多，不，是特别多。盗版不会自动更新，
所以IE7、8最多，而且IE9也不支持XP
甚至你可以教会 IE6 (Windows XP 2001) 浏览器处理未知的 HTML 元素。
HTML5 定了 8 个新的 HTML 语义（semantic） 元素。所有这些元素都是 块级 元素。
header, section, footer, aside, nav, main, article, figure {
display: block;
}
为了能让旧版本的浏览器正确显示这些元素，你可以设置 CSS 的 display 属性值为 block:
----------------创建新的元素，利用javascriptdedocument.creatElement(‘‘),记得 CSS把其设置为block
你可以为 HTML 添加新的元素。
JavaScript 语句 document.createElement("myHero") 是为 IE 浏览器添加新的元素。
EG:
<myHero>我的第一个新元素</myHero>
<script>
document.createElement("myHero")
</script>
<style>
myHero {
display: block;
background-color: #ddd;
padding: 50px;
font-size: 30px;
}
</style>
27
HTML5
swf(shock wave flash)是Macromedia(现已被ADOBE公司收购)公司的动画设计软件Flash的专用格式，
被广泛应用于网页设计、动画制作等领域，swf文件通常也被称为Flash文件。
bdi 指的是 bidi 隔离（Bi-directional Isolation）。
<bdi> 标签允许您设置一段文本，使其脱离其父元素的文本方向设置。
注释：只有 IE 9 支持 <command> 标签，其他之前版本或者之后版本的 IE 浏览器不支持 <command> 标签。
IE 10、Firefox、Opera、Chrome 和 Safari 6 支持 <progress> 标签。
28
SVG优势
与其他图像格式相比（比如 JPEG 和 GIF），使用 SVG 的优势在于：
SVG 图像可通过文本编辑器来创建和修改
SVG 图像可被搜索、索引、脚本化或压缩
SVG 是可伸缩的
SVG 图像可在任何的分辨率下被高质量地打印
SVG 可在图像质量不下降的情况下被放大
Canvas 与 SVG 的比较
下表列出了 canvas 与 SVG 之间的一些不同之处。
Canvas SVG
依赖分辨率
不支持事件处理器
弱的文本渲染能力
能够以 .png 或 .jpg 格式保存结果图像
最适合图像密集型的游戏，其中的许多对象会被频繁重绘
不依赖分辨率
支持事件处理器
最适合带有大型渲染区域的应用程序（比如谷歌地图）
复杂度高会减慢渲染速度（任何过度使用 DOM 的应用都不快）
不适合游戏应用
29
e.target 是目标对象，e.event是目标所发生的事件。