说明：以下内容学习自：http://www.w3school.com.cn/

1、
以下记录了一些常用的html元素，块，类，第一个是html和head，用来申明是html文件，以及head部分的代码：

2、
h1 定义标题的开始

3、
body 定义 HTML 文档的主体

4、
P表示段落

5、
table 定义 HTML 表格

6、
a 用来定义链接，如下代码

<a href="http://www.w3school.com.cn">This is a link</a>

7、

img 定义图像如下代码

[站外图片上传中……(2)]

8、

无序列表始于 ul 标签。每个列表项始于 li。代码和效果如下：

<ul>
  <li>咖啡</li>
  <li>茶</li>
  <li>牛奶</li>
</ul>

9、div是块级元素，它是可用于组合其他 HTML 元素的容器，浏览器通常会在 div 元素前后放置一个换行符。另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法，感觉可以理解成一个函数或集合。举例：

<div style="color:#00FF00">
<h3>This is a header</h3>
<p>This is a paragraph.</p>
</div>

<div style="color:#00FF00">
<h3>This is a header</h3>
<p>This is a paragraph.</p>
</div>

10、 span 元素，然后对这个 span 元素的父元素，即 p 元素应用 class，这样就可以对这个类的子元素 span 应用相应的样式了。

<p class="tip"><span>提示：</span>... ... ...</p>

或者CSS：

p.tip span {
        font-weight:bold;
        color:#ff9955;
}

11、类的概念，以div的一段代码为例，可以发现，在head部分定义了一个cities的类，然后div引用了这个类，作用是把背景设置为黑色，字体为白色，margin和padding都设置为20px，另外类引用到span也是差不多的，形如<span class="xxx">：

<!DOCTYPE html>
<html>
<head>
<style>
.cities {
    background-color:black;
    color:white;
    margin:20px;
    padding:20px;
}    
</style>
</head>

<body>

<div class="cities">
<h2>London</h2>

<p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>

<p>Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.</p>
</div> 

</body>
</html>

12、布局，用一张图来体验下，其实就是一些文字+底色的布局，但是看上去有点大气，用到了#符号，以及
div id="header"这样的形式，具体代码参考这里【点我】