HTML: HyperText Markup Language (超文本标记语言)
Hypertext(超文本) means "text with links in it."
A markup language（标记语言） is a programming language used to make text do more than just sit on a page: it can turn text into images, links, tables, lists, and much more.
HTML可以看作每个网页的骨架，组成了网页的结构。
CSS: Cascading Style Sheets(级联样式表)
CSS让网页更加漂亮，比如它可以给网页设置皮肤。
HTML基本结构
<!DOCTYPE html> // 总是在第一行，告诉浏览器在读什么语言
<html> // HTML文档的开始部分
</html> // HTML文档的结束部分
基本术语
1. 标签
两个尖括号<xxx>括起来的叫做tags（标签）.
Tags总是成对出现： 一个opening tag（开口标签） and a closing tag（闭合标签）.
Example of opening tag: <html>
Example of closing tag: </html>
可以把标签看作是括号匹配的形式，每当你有一个开口标签，一定要有一个对应的闭合标签。标签也可以嵌套，应该按正确的形式进行嵌套：一个闭合标签应和它左边最近的一个开口标签匹配。例如，
合法的：<first tag><second tag> Some text! </second tag></first tag>
不合法的：<first tag><second tag>Some text!</first tag></second tag>
<strong> </strong>粗体字
head（头部）
整个html文件的内容都在<html> </html>之内
There are always two parts to the file: the head and body
a. It has an opening and a closing tag.
head有开口标签和闭合标签
b. The head includes important information about the webpage, such as its title.
更多精彩内容：http://www.bianceng.cn/web/Html/
head包含网页的重要信息，比如标题
c. The title is the words we see in the tab (for example, the title of this page is "Introduction to HTML").
标题就是我们在tab栏看到的字
Body（主体）内的段落
我们把一对标签和标签里的内容叫做element（元素）
element = <opening tag> + content + <closing tag>
在<body>标签里的内容是在网页中的真正的可视部分
<html>
<head></head>
<body></body>
</html>
1. 在title标签内，是你页面的名字，可以是任何东西。
2. 在title标签下，是body标签
3. 在body标签内，我们可以创建段落，<p> content </p>
Paragraphs and headings（段落和标题）
我们已经学习了：
1. 创建一个有标签的html文件
2. 在<head>中创建标题（title）
3. 在<body>中创建段落（p）
接下来，我们还可以给我们的段落创建标题，<p>是最大的标题
HTML给了我们很多种标题尺寸，<p>是最大的，<h6>是最小的标题
<p> - The CEO
<h2> - VP of Fancy Towne
<h3> - Director of Some Stuff
<h4> - Middle management
<h5> - Lowly assistant
<h6> - Gets coffee for everyone else
Mid-lesson breather中途小结
1. HTML是用来给网页做结构的
2. 我们用浏览器来打开html文件，并且浏览器展示文件内容给我们
3. html有一个<head>和一个<body>标签
4. 在head中，我们有<title>文档标题，用这个来表示页面的名字
5. 怎样制作段落(p)和段落的标题(h1,h2...h6)
Adding images（添加图片）
可以在网站中添加图片使得网页更加漂亮！只要一个标签：<img>.
这个标签和其它有些不一样，它并不是把内容放在开口标签和闭合标签之间，而是用src告诉标签图片在哪里！
同时，这个标签不同之处还在于它使用的闭合方式是self-closes，即<imgsrc="url" />
每个图片在网络中都有它的url，我们只要直接引用url就可以了，例如：
<img src="jpg/f3a16fb6.jpg" />
Click that image（点击图片）
可以设置点击图片，然后跳转到另一个页面
<a>标签是用来设置超链接（hyperlinks）的，就像<img>的src属性一样，<a>也有它的属性href用来说明跳转到何处
<a href="http://www.codecademy.com">Learn to code!</a>
如果要设置点击图片，然后跳转，那么可以把图片放在<a href = "url"> img </a>中。