- 001-HTML教程
超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。我们可以使用 HTML 来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析。
HTML实例
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>菜鸟教程（runoob.com）</title> 6 </head> 7 <body> 8 <h1>我的第一个标题</h1> 9 <p>我的第一个段落</p> 10 </body> 11 </html>
HTML文档的后缀名
- html
- htm
以上两种后缀名没有区别，都可以使用。
- 002-HTML 简介
HTML实例
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>天晴天朗（tqtl.org）</title> 6 </head> 7 <body> 8 <h1>我的第一个标题哦！</h1> 9 <p>我的第一个段落哦！</p> 10 </body> 11 </html>
实例解析
- <!DOCTYPE html> 声明为 HTML5 文档
- <html> 元素是 HTML 页面的根元素
- <head> 元素包含了文档的元（meta）数据
- <title> 元素描述了文档的标题
- <body> 元素包含了可见的页面内容
- <h1> 元素定义一个大标题
- <p> 元素定义一个段落
什么是HTML?（HTML是用来描述网页的一种语言）
- HTML指的是“超文本标记语言”:Hyper Text Markup Language
- HTML不是一种编程语言，而是一种标记语言
- 标记语言是一套“标记标签”（markup tag）
- HTML使用标记标签来描述网页
- HTML文档包含了HTML标签及文档内容
- HTML文档也叫作Web界面
HTML 标签（HTML标签通常被称为HTML标签-HTML tag）
- HTML标签是有尖括号包含的关键词，比如<html>
- HTML标签通常是成对出现的，比如<head></head>
- 标签对中的第一个标签是开始标签，第二个是结束标签
- 开始和结束标签也被称为开放和闭合标签
1 <标签>内容</标签>
HTML 元素
“HTML标签”和“HTML元素”通常都是描述同样的意思，但严格来讲，一个HTML元素包含了开始和结束标签，如
1 <p>这是一个段落。</p>
Web 浏览器
Web浏览器（如谷歌浏览器，Internet Explorer，Firefox，Safari）是用于读取HTML文件，并将其作为网页显示。浏览器并不是直接显示的HTML标签，但可以使用标签来决定如何展现HTML页面的内容给用户。
HTML版本
- HTML 1991
- HTML + 1993
- HTML 2.0 1995
- HTML 3.2 1997
- HTML 4.0.1 1999
- XHTML 1.0
- HTML5 2012
- XHTML5 2013
<!DOCTYPE> 声明
<!DOCTYPE>声明有助于浏览器中正确显示网页。网络上有很多不同的文件，如果能够正确声明HTML的版本，浏览器就能正确显示网页内容。doctype 声明是不区分大小写的，以下方式均可：
1 <!DOCTYPE html> 但是建议使用此方式 2 3 <!DOCTYPE HTML> 4 5 <!doctype html> 6 7 <!Doctype Html>
通用声明
HTML5
1 <!DOCTYPE html>
HTML4.0.1
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 "http://www.w3.org/TR/html4/loose.dtd">
XHTML 1.0
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
中文编码（目前在大部分浏览器中，直接输出中文会出现中文乱码的情况，这时候我们就需要在头部将字符声明为 UTF-8。）
1 <!DOCTYPE html>fdsa 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>天晴天朗（tqtl.org）</title> 6 </head> 7 <body> 8 <h1>我的第一个标题哦！</h1> 9 <p>我的第一个段落哦！</p> 10 </body> 11 </html>
- 003HTML 编辑器
HTML 编辑器推荐
- Notepad++ http://rj.baidu.com/soft/detail/13478.html?ald
- Sublime
- HBuilder http://www.dcloud.io/ 最为推荐，简直就是史上最为强大的IDE，没有之一！
- WebStorm https://www.jetbrains.com/webstorm/download/#section=windows 也是神器！
- 004-HTML 基础
HTML标题（HTML 标题（Heading）是通过<h1> - <h6> 标签来定义的.）
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>天晴天朗（tqtl.org）</title> 6 </head> 7 <body> 8 <h1>这是一个最1大的标题</h1> 9 <h2>这是一个最2大的标题</h2> 10 <h3>这是一个最3大的标题</h3> 11 <h4>这是一个最4大的标题</h4> 12 <h5>这是一个最5大的标题</h5> 13 <h6>这是一个最6大的标题</h6> 14 </body> 15 </html>
HTML 段落
1 <p>这里是一个段落哦!</p> 2 <p>我也是一个段落!</p>
HTML 链接
1 <a href="http://www.cuixiaozhao.com">这是一个超链接</a>
HTML 图像
1 <img src="/images/logo.png" width="258" height="39" />
- 005-HTML 元素
HTML 元素语法
- HTML元素以开始标签起始
- HTML元素以结束标签终止
- 元素的内容是开始和结束标签之间的部分
- 某些HTML元素具有空内容（empty content）
- 空元素在开始标签中进行关闭
- 大多数HTML元素可拥有属性
HTML文档实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML元素</title> </head> <body> <p>这里是放置段落的地方</p> </body> </html>
以上实例包含了4个 HTML 元素。
<p>元素
<body>元素
<head>元素
<html>元素
不要忘记结束标签
<p>这里是放置段落的地方 <p>这里是放置段落的地方
以上实例在浏览器中也能正常显示，因为关闭标签是可选的。但不要依赖这种做法。忘记使用结束标签会产生不可预料的结果或错误。
HTML 空元素
1、没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。
2、<br> 就是没有关闭标签的空元素（<br> 标签定义换行）。
3、在 XHTML、XML 以及未来版本的 HTML 中，所有元素都必须被关闭。
4、在开始标签中添加斜杠，比如 <br />，是关闭空元素的正确方法，HTML、XHTML 和 XML 都接受这种方式。
5、即使 <br> 在所有浏览器中都是有效的，但使用 <br /> 其实是更长远的保障。
HTML 提示：使用小写标签
HTML 标签对大小写不敏感：<P> 等同于 <p>。许多网站都使用大写的 HTML 标签。
菜鸟教程使用的是小写标签，因为万维网联盟（W3C）在 HTML 4 中推荐使用小写，而在未来 (X)HTML 版本中强制使用小写。（希望大家一出手，就是专业的！）
- 006-HTML属性（属性为 HTML 元素提供附加信息。）
HTML 属性
HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。属性总是以名称/值对的形式出现，比如：name="value"。属性总是在 HTML 元素的开始标签中规定。
属性实例
<a href="http://www.w3school.com.cn">This is a link</a>
更多 HTML 属性实例
属性例子 1:
<h1> 定义标题的开始。
<h1 align="center"> 拥有关于对齐方式的附加信息。
属性例子 2:
<body> 定义 HTML 文档的主体。
<body bgcolor="yellow"> 拥有关于背景颜色的附加信息。
属性例子 3:
<table> 定义 HTML 表格。（您将在稍后的章节学习到更多有关 HTML 表格的内容）
<table border="1"> 拥有关于表格边框的附加信息。
HTML 提示：使用小写属性
属性和属性值对大小写不敏感。
不过，万维网联盟在其 HTML 4 推荐标准中推荐小写的属性/属性值。而新版本的 (X)HTML 要求使用小写属性。
始终为属性值加引号
属性值应该始终被包括在引号内。双引号是最常用的，不过使用单引号也没有问题。
在某些个别的情况下，比如属性值本身就含有双引号，那么您必须使用单引号，例如：
name='Bill "HelloWorld" Gates'
