html学习笔记
<!DOCTYPE html>
<html>
<!--head:配置，样式表，选项-->
<head>
<title>我的第一个页面</title>
<meta charset = UTF-8 >
</head>
<body title = "第一章">
我的第一个页面
<!--p:段落-->
<!--br:段行-->
<p>
<hgroup>
<h1 id = "here">第一章</h1>
<h2>小标题</h2>
</hgroup>
开头<br>
</p>
a<sup>2</sup> + 2<sub>b</sub> = x;
<mark >豫章故郡</mark>，洪都新府。星分翼轸，地接衡庐。襟三江而带五湖，控蛮荆而引瓯越。物华天宝，龙光射牛斗之墟；人杰地灵，徐孺下陈蕃之榻。雄州雾列，俊采星驰。台隍枕夷夏之交，宾主尽东南之美。都督阎公之雅望，棨戟遥临；宇文新州之懿范，襜帷暂驻。十旬休假，胜友如云；千里逢迎，高朋满座。腾蛟起凤，孟学士之词宗；紫电青霜，王将军之武库。家君作宰，路出名区；童子何知，躬逢胜饯。(豫章故郡 一作：南昌故郡)
时维九月，序属三秋。潦水尽而寒潭清，烟光凝而暮山紫。俨骖騑于上路，访风景于崇阿。临帝子之长洲，得仙人之旧馆。层峦耸翠，上出重霄；飞阁流丹，下临无地。鹤汀凫渚，穷岛屿之萦回；桂殿兰宫，即冈峦之体势。（层峦 一作：层台；即冈 一作：列冈；天人 一作：仙人）
披绣闼，俯雕甍，山原旷其盈视，川泽纡其骇瞩。闾阎扑地，钟鸣鼎食之家；舸舰迷津，青雀黄龙之舳。云销雨霁，彩彻区明。落霞与孤鹜齐飞，秋水共长天一色。渔舟唱晚，响穷彭蠡之滨，雁阵惊寒，声断衡阳之浦。(轴 通：舳；迷津 一作：弥津；云销雨霁，彩彻区明 一作：虹销雨霁，彩彻云衢)
遥襟甫畅，逸兴遄飞。爽籁发而清风生，纤歌凝而白云遏。睢园绿竹，气凌彭泽之樽；邺水朱华，光照临川之笔。四美具，二难并。穷睇眄于中天，极娱游于暇日。天高地迥，觉宇宙之无穷；兴尽悲来，识盈虚之有数。望长安于日下，目吴会于云间。地势极而南溟深，天柱高而北辰远。关山难越，谁悲失路之人；萍水相逢，尽是他乡之客。怀帝阍而不见，奉宣室以何年？(遥襟甫畅 一作：遥吟俯畅)
嗟乎！时运不齐，命途多舛。冯唐易老，李广难封。屈贾谊于长沙，非无圣主；窜梁鸿于海曲，岂乏明时？所赖君子见机，达人知命。老当益壮，宁移白首之心？穷且益坚，不坠青云之志。酌贪泉而觉爽，处涸辙以犹欢。北海虽赊，扶摇可接；东隅已逝，桑榆非晚。孟尝高洁，空余报国之情；阮籍猖狂，岂效穷途之哭！(见机 一作：安贫)
勃，三尺微命，一介书生。无路请缨，等终军之弱冠；有怀投笔，慕宗悫之长风。舍簪笏于百龄，奉晨昏于万里。非谢家之宝树，接孟氏之芳邻。他日趋庭，叨陪鲤对；今兹捧袂，喜托龙门。杨意不逢，抚凌云而自惜；钟期既遇，奏流水以何惭？
呜乎！胜地不常，盛筵难再；兰亭已矣，梓泽丘墟。临别赠言，幸承恩于伟饯；登高作赋，是所望于群公。敢竭鄙怀，恭疏短引；一言均赋，四韵俱成。请洒潘江，各倾陆海云尔：
<b>
<!--pre:去格式化-->
<pre>
<tt>滕王高阁临江渚，佩玉鸣鸾罢歌舞。</tt>
<small>画栋朝飞南浦云，<del>bai</del><ins>珠帘</ins><s>暮卷</s>西山雨。</small>
闲云潭影日悠悠，物换星移几度秋。
<i>阁中帝子今何在？槛外长江空自流。</i>
</b>
</pre>
<pre>
注释：<em>强调</em>
<strong>着重<strong>
<dfn>定义</dfn>
<code>代码</code>
<samp>例子代码</samp>
<kbd>用户输入<kbd>
<var>变量</var>
<cite>引用</cite>
<!--blockquote:缩进-->
<blockquote>
<!--address：地址-->
<address>
Room 301 A <br>
11 group <br>
SiChuan road
<blockquote>小缩进</blockquote>
<q>小小的</q>
</address>
</blockquote>
<!--去格式化-->
<pre>
int main (){
printf("hello world");
}
</pre>
<!--hr:分割线 不被提倡使用-->
<hr width = 50>
<hr width = 50%>
<hr width = "50%" align = left size = 10>
<!--abbr:缩写-->
<!--title = "" -->
<abbr title = "中华人民共和国">PRC</abbr> was founded in 1949;
<bdo>反向</bdo>
<bdi>正向</bdi>
<bdo dir = rtl>改变字体方向， <bdi>右向左排</bdi></bdo>
<!--<:小于 >:大于 &:&  :空格-->
a<2
2>a
&
& &//不可打断
Lü
LÜ
<!--ul:unorder list li:list item-->
<ul>
<li>tea</li>
<li>coffee</li>
<li>water</li>
</ul>
<!--ul:order list（数字） li:list item-->
<ol start = 2>
<li>tea</li>
<li>coffee
<ul>
<li>no sugar</li>
<li>sugar</li>
</ul>
</li>
<li>water</li>
</ol>
<!--解释的词条-->
<dl>
<dt>方糖</dt>
<dd>解释：方的糖</dd>
</dl>
<!--图片 alt:可选的，链接中图片不能记载，即可加载此图片 usemap:使用了一个影射地图，影射里面放置了两个区域-->
<img src = "http://gtb.baidu.com/HttpService/get?p=dHlwZT1pbWFnZS9qcGVnJm49dmlzJnQ9YWRpbWcmYz10YjppZyZyPTg5NTMyNjY3NywzNDQyODIxNjcw" width = "200" height = 200 usemap = "#map" alt = "mama"/>
<map name = "map">
<area shape = "rect" coords = "0,0,50,50" href = "http://news.163.com" target = _blank></area>
<area shape = "circle" coords = "75,75,25" href = "http://www.163.com" target = _blank></area>
</map>
<iframe src = "http://news.163.com" height = 400></iframe>
<!--超文本 链接-->
<a href = "http://news.163.com" target = _blank>网易新闻</a>
<a href = #here>跳到Here</a>
<!--table td : 列 tr : 行 th: 表头 caption : 名称 colspan : 占位及格-->
开始
<table border = 1>
<caption>表格名称</caption>
<thead>
<tr>
<th>English</th>
<th>digit</th>
<th>chinese</th>
</tr>
</thead>
<tbody>
<tr>
<td>one</td>
<td>1</td>
<td>一</td>
</tr>
<tr>
<td colspan = 3>big</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>foot</td>
</tr>
</tfoot>
</table>
结束
</pre>
</body>
</html>
1. <wbr>change</wbr>:表示change可分开
2. <b>bold</b>:加粗
3. <small></small>:变小
4. <i>italics</i>:斜体
5. <tt>evening</tt>:打字机字体（等宽字体）
6. <del></del>:删除
7. <s></s>:不被提倡使用，已过时
8. a<sup>2</sup>:上标
9. b<sub>a<sub>:下标
10. <mark></mark>:高亮
11. <em>强调</em>
12. <strong>着重<strong>
13. <dfn>定义</dfn>
14. <code>代码</code>
15. <samp>例子代码</samp>
16. <kbd>用户输入<kbd>
17. <var>变量</var>
18. <cite>引用</cite>
19. <address>地址</address>
20. <blockquote>缩进</blockquote>
21. <q>小缩进</q>
22. <pre>去格式化</pre>
1. <hr>:水平线
2. <abbr>缩写</abbr>
3. <bdo>反向</bdo>
4. <bdi>正向</bdi>
5. a<2 : a < 2
6. 2>a : 2 > a
7. & : &
8. & &//不可打断
9. Lü :小写u
10. LÜ :大写U
11. <p id = here></p>
12. <a href = #id></a>
