html5笔记
一个界面最多能有6个大标题<h1>~<h6>；能有任意个段落<p></p>;
链接是用<a></a>标签来表示,如：<a href="url">这是一个链接</a>
href为元素<a>的属性。
还有一个属性target，如果你将 target 属性设置为 "_blank", 链接将在新窗口打开。如：<a href="url" target="_blank">这是一个链接</a>将会打开一个新的标签页
id属性：在HTML文档中创建一个链接到"有用的提示部分(id="tips"）"：<a href="#网址为url">网址</a>
或者，打开一个新的页面连接到url：<a href="url#网址为url">网址</a>
图片链接：<a href="url"><img scr></a>
在当前页面链接到指定位置：使用标签id，如：<p><a href="#C4">查看章节 4</a></p>
<h2><a id="C4">章节 4</a></h2><p>这边显示该章节的内容……</p>
-----------------------------------------------------------------分割线-------------------------------------------------------------
头部： <base href="url"> 定义页面默认链接地址
<style> 标签定义了HTML文档的样式文件引用地址，在<style> 元素中你也可以直接添加样式来渲染 HTML 文档，如：
<head> <style type="text/css"> body {background-color:yellow} p {color:blue} </style> </head>
<meta> 标签提供了元数据.元数据也不显示在页面上，但会被浏览器解析。如为搜索引擎定义关键词:<meta name="keywords" content="HTML笔记">
为网页定义描述内容:<meta name="description" content="我星伤悲">
定义网页作者:<meta name="anthor" content="jxxjxxjxx">
每30秒钟刷新当前页面:<meta http-equiv="refresh" content="30"> 等。
<script>标签用于加载脚本文件，如： JavaScript。
-----------------------------------------------------------------分割线-------------------------------------------------------------
图片是用<img>标签来表示,如：<img src="image/Tulips.jpg" width=1024 height=768 />
图片中的可点击区域用<area>表示
<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>
shape表示可点击区域的形状，coorda表示可点击区域的坐标：
1、矩形：(左上角顶点坐标为(x1,y1)，右下角顶点坐标为(x2,y2))
2、圆形：(圆心坐标为(X1,y1)，半径为r)
3、多边形：(各顶点坐标依次为(x1,y1)、(x2,y2)、(x3,y3) ......)
换行标签是<br>
空元素</元素>：没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。标记了空元素的元素将不会被显示出来,如上面的</img src="image/Tulips.jpg" width=1024 height=768 />将不会被显示
按钮元素是<button>,如：<button type="button">按钮</button>
注释用<!.....>元素表示
-----------------------------------------------------------------分割线-------------------------------------------------------------
1到6号标题与1到6号字体逆序对应，比如1号字体对应6号标题，2号字体对应5号标题。如
<h1>这是1号标题</h1> <font size="6">这是6号字体文本</font> <h2>这是2号标题</h2> <font size="5">这是5号字体文本</font> <h3>这是3号标题</h3> <font size="4">这是4号字体文本</font> <h4>这是4号标题</h4> <font size="3">这是3号字体文本</font> <h5>这是5号标题</h5> <font size="2">这是2号字体文本</font> <h6>这是6号标题</h6> <font size="1">这是1号字体文本</font>
文本格式： 斜体文本<i> </i>, <em> </em>
加粗文本<b></b>, <strong> </strong>
上标<sub> </sub>
下标<sup></sup>
缩小<small></small>
计算机输出<code> </code>
键盘输入<kbd> </kbd>
打字机文本<tt> </tt>
计算机代码样本<samp> </samp>
计算机变量<var> </var>
地址<address></address>
缩写<abbr title=".......">...</abbr>，在某些浏览器中，当您把鼠标移至缩略词语上时，title 可用于展示表达的完整版本。
改变文字书写的方向<bdo dir="rtl">从右到左。</bdo>，会显示为。左到右从
删除文本<del></del>，如<p>color is <del>red</del> blue.</p> 显示为 ：color is red blue.
插入文本(下划线)<ins></ins>，如<p>color is <ins>red</ins>.</p> 会显示为：color is red.
引用语<q></q>
-----------------------------------------------------------------CSS-------------------------------------------------------------
可以在<head>头信息里改变字体的颜色和背景
使用 style 属性制作一个没有下划线的链接。
<a href="http://www.cnblogs.com/jxxclj/" style="text-decoration:none;" target="_blank">我星伤悲的主页</a>
标签链接到一个外部样式表。
CSS 可以通过以下方式添加到HTML中:
- 内联样式- 在HTML元素中使用"style" 属性
- 内部样式表 -在HTML文档头部 <head> 区域使用<style> 元素 来包含CSS
- 外部引用 - 使用外部 CSS 文件
内联样式
当特殊的样式需要应用到个别元素时，就可以使用内联样式。 使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。
<p style="color:blue;margin-left:20px;">This is a paragraph.</p>
我们可以使用font-family（字体），color（颜色），和font-size（字体大小）属性来定义字体的样式:
<p style="font-family:arial;color:red;font-size:20px;">一个段落。</p>
使用 text-align（文字对齐）属性指定文本的水平与垂直对齐方式：
<h1 style="text-align:center;">居中对齐的标题</h1>
-----------------------------------------------------------------表格-------------------------------------------------------------
表格由 <table> 标签来定义
字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
表格的表头使用 <th> 标签进行定义。一般会被浏览器居中并加粗。
带标题 (caption) 的表格用<taption>标签
定义跨行或跨列的表格单元格用colspan属性或者rowspan属性。
单元格边距在table标签里用cellpadding属性，单元格间距用cellspacing属性。
-----------------------------------------------------------------列表-------------------------------------------------------------
无序列表使用<ul>标签，有序列表使用<ol>标签，定义不同类型的无序列表使用style属性，有style="list-style-type:circle"（圆圈列表），style="list-style-type:square"（正方形列表），style="list-style-type:disc"（圆点列表）
<ol>标签可使用start属性定义开始位置，也可以使用type定义从字面A/a开始。
自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。
-----------------------------------------------------------------表单-------------------------------------------------------------
表单元素是允许用户在表单中输入内容,比如：文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等。
表单使用表单标签 <form> 来设置。
文本输入使用input type="text"属性；
<input type="radio"> 标签定义了表单单选框选项；
<input type="checkbox"> 定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项。
<input type="submit"> 定义了提交按钮，当用户单击确认按钮时，表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。
下拉框使用select标签（<select name="cars">），选项使用option标签（<option value="xing">xing</option>），option中可用selected属性定义默认选项。
文本域使用textarea标签；
按钮使用button属性（<input type="button" value="hello world!">）；
