什么是HTML
HTML 指的是超文本标记语言 (Hyper Text Markup Language)，用于描述网页。它定义了网页内容的含义和结构。除 HTML 以外的其它技术则通常用来描述一个网页的表现与展示效果（如 CSS），或功能与行为（如 JavaScript）。
HTML示例及结构剖析
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="./css/mycss.css">
<title>页面标题</title>
</head>
<body>
<h1>我是有样式的</h1>
<hr>
<p class="haha">还是有点丑：)</p>
</body>
</html>
<!DOCTYPE html>：声明文档类型。
<html>：这个元素包裹了整个完整的页面，是一个根元素，其它元素都嵌套到其中。
<head>：这个元素是一个容器，它包含了所有你想包含在HTML页面中但不想在HTML页面中显示的内容。
<meta charset="utf-8">：这个元素设置文档使用utf-8字符集编码。
<link>:链接到外部样式文件.
<title>：设置页面标题，出现在浏览器标签上。
<body>：包含你能在页面看到的所有内容，包括文本，图片，音频，游戏等等。
<h1>：一级标题。
<p>：段落内容。
HTML元素
“HTML 标签” 和 “HTML 元素” 通常都是描述同样的意思.
但是严格来讲, 一个 HTML 元素包含了开始标签与结束标签
HTML中的标签
- HTML 标签是由尖括号包围的关键词，比如
- HTML 标签通常是成对出现的，比如
<b>和</b> - 标签对中的第一个标签是开始标签，第二个标签是结束标签
- 开始和结束标签也被称为开放标签和闭合标
`
HTML属性
HTML 元素可以设置属性
属性可以在元素中添加附加信息
属性一般描述于开始标签
属性总是以名称/值对的形式出现，比如：name=“value”
标题Heading
HTML 标题（Heading）是通过<h1 - h6> 标签来定义的
一级标题<h1>最醒目，应该用于页面的主标题，其次为二级标题，以此类推。
在页面中，标题非常重要：
1.搜索引擎用标题来索引页面的内容
2.用户也习惯以标题进行主要内容浏览，以决定是否查看该页面
HTML 段落
HTML 段落是通过标签 p来定义的
<p>This is a paragraph</p>
<p>This is another paragraph</p>
如果希望在不产生一个新段落的情况下进行换行（新行），使用 <br /> 标签：
<p>This is<br />a para<br />graph with line breaks</p>
HTML链接
HTML 使用超级链接与网络上的另一个文档相连。
几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。
我们通过使用 <a> 标签在 HTML 中创建链接。
<a href="url">Link text</a>
有两种使用 <a> 标签的方式：
- 通过使用 href 属性 - 创建指向另一个文档的链接
- 通过使用 name 属性 - 创建文档内的书签
使用 target 属性，你可以定义被链接的文档在何处显示。
<a href="http://www.cqjtu.com.cn/" target="_blank">Visit CQJTU!</a>
HTML图像
<img>：定义图像。
<map>：定义图像地图。
<area>： 定义图像地图中的可点击区域。
在 HTML 中，图像由 <img> 标签定义。
<img> 是空标签，意思是说，它只包含属性，并且没有闭合标签。
要在页面上显示图像，你需要使用源属性（src）。src 指 “source”。源属性的值是图像的 URL 地址。
定义图像的语法是：
<img src="url" />
URL 指存储图像的位置。
替换文本属性（Alt）
alt 属性用来为图像定义一串预备的可替换的文本。替换文本属性的值是用户定义的。
<img src="boat.gif" alt="Big Boat">
在浏览器无法载入图像时，替换文本属性告诉读者她们失去的信息。此时，浏览器将显示这个替代性的文本而不是图像。为页面上的图像都加上替换文本属性是个好习惯，这样有助于更好的显示信息，并且对于那些使用纯文本浏览器的人来说是非常有用的。
列表List
| 标签 | 语义 |
|---|---|
| ol | 有序列表 |
| ul | 无序列表 |
| dl | 定义列表 |
- 无序列表
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
- 有序列表
* <ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
- 定义列表
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>
表格Table
表格
表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
表格和边框属性
如果不定义边框属性，表格将不显示边框。有时这很有用，但是大多数时候，我们希望显示边框。
表格的表头
表格的表头使用 <th> 标签进行定义。
表格和边框属性
使用边框属性来显示一个带有边框的表格：
<table border="1">
<tr>
<td>Row 1, cell 1</td>
<td>Row 1, cell 2</td>
</tr>
</table>
表单Form
HTML 表单用于搜集不同类型的用户输入。
<form> 元素
HTML 表单用于收集用户输入。
< form > 元素定义 HTML 表单：
<form>
.
form elements
.
</form>
<input> 元素
< input > 元素是最重要的表单元素。
< input > 元素有很多形态，根据不同的 type 属性。
文本输入
<input type="text"> 定义用于文本输入的单行输入字段。
<input type="radio"> 定义单选按钮。
<input type="submit"> 定义用于向表单处理程序（form-handler）提交表单的按钮。
HTML中如何使用CSS
CSS 可以通过以下方式添加到HTML中:
- 内联样式- 在HTML元素中使用"style" 属性
当特殊的样式需要应用到个别元素时，就可以使用内联样式。 使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。
<p style="color: red; margin-left: 20px">
This is a paragraph
</p>
- 内部样式表 -在HTML文档头部 区域使用
当单个文件需要特别样式时，就可以使用内部样式表。你可以在 head 部分通过 <style> 标签定义内部样式表。
<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>
- 外部样式表 -在HTML文档在同一目录新建一个样式表文件
当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，你就可以通过更改一个文件来改变整个站点的外观。
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
3924
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
