html笔记
HTML是一种描述网页的语言，指的是超文本标记语言；HTML并不是编程语言，而是一种标记语言！
HTML标签：由尖括号包含的关键词，如<html></html>；一般都是成对出现的，如<title></title>；标签对中第一个叫开始标签，第二个加了/的叫结束标签。
HTML元素：开始标签+内容+结束标签，如:
<p>内容</p>
有些标签没有结束标签，如<br /> ， <hr />，在开始标签中闭合的叫空元素。
HTML属性：大部分元素都可以添加html元素属性，属性一般放在开始标签中，以名称=值的形式存在，属性值一般用双引号包裹起来，如下中<a>标签的href属性，值为”http:http://www.cnblogs.com/yunmengshu“。
<a href="http:http://www.cnblogs.com/yunmengshu">超链接</a>
HTML格式如下：
<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
</head>
<body>
</body>
</html>
<!DOCTYPE> 是文档声明，有助于浏览器中正确显示网页。其实就是声明了HTML的版本。目前通用的html5文档声明为 <!DOCTYPE html> 。
<html>元素说明文档为html文档，也是根元素；
<head>元素包含了所有的头部信息。
<title></title> 定义标题，就是显示在浏览器工具栏中的标题名称；
<meta> 描述了基本的元数据，如下，（当然还有其他的，需要以后慢慢摸索啦...）
<head> <meta charset="utf-8"> // 定义字符编码，通常用utf-8 <meta name="description" content="描述页面信息"> <meta name="keywords" content="页面中的关键词"> <meta name="author" content="作者信息"> <meta http-equiv="refresh" content="5"> // 每5秒刷新页面，可以在5后面加URL <link rel="stylesheet" type="text/css" href="外部链接路径"> <style type="text/css">这里写css样式</style> <script type="text/javascript" src="外部脚本路径">这里不允许写js</script> <script type="text/javascript">这里写js</script> // 不仅仅可以放在head元素中，还可以放在当前文档的<body>元素中 </head>
<body>元素中放的就是显示在页面中的内容啦！包含很多的标签元素和文本、图像、声音、视频等等内容！
标题：<h1>,<h2>,<h3>,<h4>,<h5>,<h6> 显示在页面上字体按顺序由大到小
段落：<p></p>
换行：<br />
分割线：<hr />
引用短的句子：<q></q> 显示在页面中就是将句子加了一个“双引号”，但是不要只为了需要双引号而是用<q>
引用大块的句子或段落：<blockquote cite=""></blockquote> 显示在页面是整体缩进,但是不要只为了需要缩进而使用<blockquote>,cite属性值是引用的出处
定义作品标题：<cite></cite>
粗体：<b></b>
斜体：<i></i>
强调：<em></em> 显示为斜体，不要为了使用斜体而是用em
强调：<strong></strong> 比em更强烈的强调，显示为粗体,不要为了使用粗体而是用strong
计算机代码：<code></code>
保留：<pre></pre> 可以保留文档中的空格、换行和TAB
上标：<sup></sup>
下标：<sub></sub>
无意义标签：<div></div>,可作为容器，用来布局；<span></span>,可以用来和css配合改变文字的样式
全局属性：id 必须以字母开头（大小写都可），后面跟字母(大小写都可)、数字(0-9)、连字符("-")、下划线("_")、冒号(":") 以及点号(".")；文档中不能有相同的ID名称；
class 必须以字母开头（大小写都可），后面跟字母(大小写都可)、数字(0-9)、连字符("-")、下划线("_")；文档中可以有相同的class名称；
style 行内样式
title 显示额外信息
注释：<!-- 注释内容 -->
实体字符：
< <
> >
& &
空格
© ©
更多实体字符 http://www.w3cschool.cn/htmltags/ref-entities.html
图像：<img src="图像所在路径" alt="" />, alt中的文本描述图片基本信息，当页面加载不出来图片的时候就会显示alt中的文本；<img>可以和<map>合作将图像定义客户器端图像映射，如下
<!-- shape定义区域的形状，coords定义区域的坐标，href定义URL。 <img>的usemap属性值只是在<map>中name的属性值加#，这个很重要 --> <img src="#" width="" height="" usemap="#map" /> <map name="map"> <area shape="rect" coords="0,0,50,60" href="#"></area> <area shape="circle" coords="0,0,50" href="#"></area> </map>
超链接：<a> 有以下几种使用情况，
1.文本超链接 <a href="http://www.cnblogs.com/yunmengshu/" target="_blank" title="超链接到我的博客">超链接</a> target属性有 _self (默认，在当前页面打开链接页面)，_blank (在新的窗口打开连接页面)，_top (在整个窗口中打开被链接文档)，和<iframe>中name属性配合显示在iframe中的页面。 title中的内容在鼠标放在链接文本上的时候会显示出来
2.图像超链接 <a href="http://www.cnblogs.com/yunmengshu/" target="_blank"><img src="图像所在路径" alt="" /></a>
3.定义锚点
<body> <a id="tips">锚点</a> // id 或者 name 都可以 <a href="#tips">回到锚点</a> </body>
4.显示在iframe中
<body> <a href="http://www.cnblogs.com/yunmengshu/" target="a">显示在iframe中,咻</a> <iframe name="a"></iframe> <!-- iframe 使用方法如下，会直接在iframe上显示对应的页面 <iframe src="URL" width="" height=""></iframe> --> </body>
5.链接到邮箱或者手机
<body> <a href="mailto:yinyupiaoxue@126.com" target="_blank"">联系邮箱</a> <a href="tel:###########">联系手机</a> <-- mailto后可跟多个邮箱，最后一个邮箱用?结束，后面是”cc=邮箱”（抄送），也可多个邮箱，用&结束，后面可跟“subject=主题”，以&结束，还可加“body=内容”，如下 <a href="mailto:yinyupiaoxue@126.com?cc=1023027599@qq.com&subject=The%20subject%20of%20the%20email&body=The%20body%20of%20the%20email">联系邮箱</a> %20在这里代表空格 --> </body>
无序列表
<ul>
<li>html</li>
<li>css</li>
<li>javascript</li>
</ul>
注：无序列表默认实心黑色圆点，type属性可以改变，共有三个值：disc（默认）,circle（空心圆点）,square（实心黑色方块）。当然用css最好。
有序列表
<ol>
<li>html</li>
<li>css</li>
<li>javascript</li>
</ol>
注：有序列表默认数字排序，type属性可以改变，有好几个值：1（数字）, a（字母）等等；shart属性可以改变排序从第几个开始，比如数字排序，start="2",排序第一个就不再是 1 ，而是 2 。用css改变样式。
自定义列表
<dl>
<dt>html</dt>
<dd>表述页面的标记语言</dd>
</dl>
注：ul ol dl 之间是可以相互嵌套的。
表格
<table>
<caption>table标题</caption>
<thead>
<tr>
<th>表头</th>
<td>单元格</td>
</tr>
</thead>
<tbody>
<tr>
<th>表头</th>
<td>单元格</td>
</tr>
</body>
<tfoot>
<th>表头</th>
<td>单元格</td>
</tr>
</tfoot>
</table>
注：td 或 th 的 colspan 属性可以合并列， rowspan 可以合并行。table 的 cellspacing 属性控制单元格间距， cellpadding 属性控制单元格边距。
表单
<form action="" method=""> // actioin 表单提交地址; method 表单提交方式 post 或者 get; 定义id属性，可以让表单外的表单元素用 form 属性关联到此表单中
<fieldset> // 分区
<legend>分区标题</legend>
账号：<input type="text" name="" /><br />
密码：<input type="password" name="" /><br />
learn:<br />
<label><input type="radio" name="ht" checked="checked" />html</label> // 同一组 radio 的 name 值必须相同；checked 默认选中
<label><input type="radio" name="ht" />css</label> // input 外加 label 为了点击字体的时候也可选中radio ;另一种方法是<label> 中的 for 属性和 radio 的 id 属性值相同
<label><input type="radio" name="ht" />javascript</label><br />
like:<br />
<label><input type="checkbox" name="l" value="骑行" />骑行</label> //
<label><input type="checkbox" name="l" value="书法" checked="checked" />书法</label>
<label><input type="checkbox" name="l" value="旅行" />旅行</label>
</fieldset>
城市：
<select>
<option>北京</option>
<option selected="selected">上海</option> // selected 默认选中
<option>郑州</option>
</select><br />
简介：<br />
<textarea cols="30" rows="5"></textarea><br />
<input type="submit" name="" />
<input type="reset" name="" />
<input type="button" name="" value="按钮" /> // 按钮还是用 <button> 标签好一些
<br />
<button type="submit">提交</button>
</form>
display 禁用； required 必须填写项； placeholder 提示词（显示灰色）；multiple 可多选；min max 最小值、最大值；width 和 height input属性；
input 的 type 属性还有其他值，比如，email，url,number, search,range,color,data,aurofocus
还有list 和 datalist 的配合使用预选项
<form> 也有新属性 这些等慢慢研究了再写
视频
<video width="" height=""> // controls 显示控制条； autoplay 自动播放；loop 循环播放；单个文件可以直接放在 src 属性中 <source src="movie.mp4" type="video/mp4" /> <source src="movie.webm" type="video/webm" /> <source src="movie.ogg" type="video/ogg" /> 您的浏览器不支持video！ </video>
音频 （同 video）
<audio width="" height=""> <source src="music.mp3" type="audio/mp3" /> <source src="music.wav" type="audio/wav" /> <source src="music.ogg" type="audio/ogg" /> 您的浏览器不支持audio！ </audio>
