HTML 链接
HTML 使用超级链接与网络上的另一个文档相连。几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。
HTML 超链接（链接）
HTML使用标签 <a>来设置超文本链接，是可以从一个页面指向另一个目的端的链接。
超链接可以是一个字，一个词，或者一组词，也可以是一幅图像，您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。
当您把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手。
在标签 <a> 中使用了 href 属性来描述链接的地址。
默认情况下，链接将以以下形式出现在浏览器中：
- 一个未访问过的链接显示为蓝色字体并带有下划线
- 访问过的链接显示为紫色并带上下划线
- 点击链接时，链接显示为红色并带上下划线
注意：如果为这些超链接设置了 CSS 样式，展示样式会根据 CSS 的设定来显示。
HTML 空链接
HTML 空链接：指指向链接后，鼠标变成手形，但单击后仍停留在当前页面。
临时加的空链接，主要为了能更好的看到最终的效果。
基本语法：
<a href="#">链接文字</a>其中“ # ”表示空链接。
HTML 链接语法
链接的 HTML 代码很简单。它类似这样：
<a href="url">Link text</a>href 属性描述了链接的目标。
提示: "链接文本" 不必一定是文本。图片或其他 HTML 元素都可以成为链接。
HTML 链接 - target 属性
使用 Target 属性，你可以定义被链接的文档在何处显示（在新的窗口打开，还是在原有的窗口中打开）。
在 HTML 文档中插入 ID：
<a id="tips">Useful Tips Section</a>在 HTML 文档中创建一个链接到"有用的提示部分 (id="tips"）"：
<a href="#tips">Visit the Useful Tips Section</a>或者，从另一个页面创建一个链接到"有用的提示 (id="tips"）部分"：
<a href="//www.w3cschool.cn/html_links.html#tips"> Visit the Useful Tips Section</a>提示：默认的被链接文档会在原有的窗口中打开的。如果将 target 属性设置为 "_blank" 则文档就会在新窗口打开。
HTML 链接 - id 属性
id 属性可用于在一个 HTML 文档中创建书签标记。
提示: 书签是不以任何特殊的方式显示，在 HTML 文档中是不显示的，所以对于读者来说是隐藏的。
注意: 请始终将正斜杠添加到子文件夹。假如这样书写链接：href="//www.w3cschool.cn/html"，就会向服务器产生两次 HTTP 请求。这是因为服务器会添加正斜杠到这个地址，然后创建一个新的请求，就像这样：href="//www.w3cschool.cn/html/"。
HTML 链接标签
案例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>本地文件链接</h1>
<P><a>这是一个链接</a></P>
<p><a href="#">这是一个链接</a></p>
<!-- href 当前目录/abc -->
<p><a href="abc">这是一个链接</a></p>
<p><a href="05.图像.html" target="_self">这是一个链接</a></p>
<h1>链接到网址</h1>
<!-- 链接到网址，需要使用协议+域名 -->
<p><a href="baidu.com">百度</a></p>
<p><a href="https://www.baidu.com" target="_blank">百度</a></p>
<h1>链接到当前目录 锚点</h1>
<a href="#ch01">第一章</a>
<a href="#ch02">第二章</a>
<a href="#ch03">第三章</a>
<a href="#ch04">第四章</a>
<a href="https://www.baidu.com"><img src="imgs/1.jpg" height="100px"></a>
<!-- 块 -->
<div id="ch01" style="height:200px;background-color: aquamarine;">
第一章
</div>
<div id="ch02" style="height:200px;background-color: skyblue;">
第二章
</div>
<div id="ch03" style="height:200px;background-color: bisque;">
第三章
</div>
<div id="ch04" style="height:200px;background-color: chartreuse;">
第四章
</div>
</body>
</html>
HTML 表格实例
HTML 表格
表格由<table>标签来定义。每个表格均有若干行（由<tr>标签定义），每行被分割为若干单元格（由<td>标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
HTML 表格的基本结构：
<table>…</table>：定义表格
<th>…</th>：定义表格的标题栏（文字加粗）
<tr>…</tr>：定义表格的行
<td>…</td>：定义表格的列
HTML 表格和边框属性
如果不定义边框属性，表格将不显示边框。有时这很有用，但是大多数时候，我们希望显示边框。
使用边框属性border来显示一个带有边框的表格。
HTML 表格表头单元格
表格的表头单元格使用<th>标签进行定义。
表格的表头单元格属性主要是一些公共属性，如：align、dir、width、height。
大多数浏览器会把表头显示为粗体居中的文本。
表格标题 <caption>
在<table>标签中我们可以使用<caption> ... </ caption>标签作为标题，并在表的顶部显示出来。
注：此标签在较新版本的HTML / XHTML中已弃用。
HTML 表格高度和宽度
在<table>标签中您可以使用width（宽）和height（高）属性设置表格宽度和高度。您可以按像素或可用屏幕区域的百分比来指定表格宽度或高度。
HTML 表格背景
使用以下方法之一设置 HTML 表格的背景
bgcolor属性 - 可以为整个表格或仅为一个单元格设置背景颜色。
background属性 - 可以为整个表设置背景图像或仅为一个单元设置背景图像。
bordercolor属性 - 可以设置边框颜色。
注：HTML5 中不推荐使用bgcolor，background和bordercolor属性。不要使用这些属性。
使用background属性需要提供图像 URL 地址。
HTML 表格空间
有以下两个属性，用于调整 HTML 表格中单元格的空间：
cellspacing属性-定义表格单元格之间的空间
cellpadding属性-表示单元格边框与单元格内容之间的距离
HTML 合并单元格
如果要将两个或多个列合并为一个列，将使用colspan属性
如果要合并两行或更多行，则将使用rowspan属性。
HTML 表格头部、主体、页脚
表格可以分为三个部分 - 头部，主体和页脚，如同word 文档中页面的页眉、正文、页脚。每个页面保持相同，而正文是表格的主要内容持有者。
头部，主体和页脚的对应的三个标签是：
- <thead> - 创建单独的表头。
- <tbody> - 表示表格的主体。
- <tfoot> - 创建一个单独的表页脚。
表可以包含多个<tbody>元素以指示不同的页面。
但值得注意的是<thead>和<tfoot>标签应出现在<tbody>之前。
HTML 表格的嵌套
可以在另一个表中使用一个表。可以使用<table>内的几乎所有标签。
HTML 表格标签
案例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<!-- talbe 表格 tr 行 td 列 数据-->
<!-- border=1 边框 -->
<h2></h2>
<table border="1" cellspacing="0" cellpadding="6">
<thead>
<tr>
<td>姓名</td>
<td>年龄</td>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>20</td>
</tr>
<tr>
<td>李四</td>
<td>18</td>
</tr>
<tr>
<td>王五</td>
<td>22</td>
</tr>
<tr>
<td>赵六</td>
<td>23</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>合计</td>
<td>4</td>
</tr>
</tfoot>
</table>
<h1>行列合并</h1>
<table border=1 width="100%" bgcolor="green">
<tr>
<td colspan="2" width="50%">科目</td>
<td rowspan="2">总得分</td>
</tr>
<tr>
<td>语文</td>
<td>数学</td>
</tr>
<tr>
<td>50</td>
<td>50</td>
<td>100</td>
</tr>
</table>
</body>
</html>
HTML 强调
为了突出一句话的意思，我们通常强调某些词，并且我们通常想要标记某些词作为重点或者表示某种程度上的不同。
可以使用em（emphasis）元素来标记这样的情况，浏览器默认风格为斜体：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p>我<em>很高兴</em>见到<em>你</em></p>
</body>
</html>
在 HTML 中我们还可以使用<strong>(strong importance)元素来标记这样的请况，浏览器默认风格为粗体：
<p>希望你明天<strong>不迟到</strong></p>
注意：为了不同的字体风格，我们应该使用元素和一些 CSS 的样式。
HTML 引用
短引用
HTML <q> 元素定义短的引用。
浏览器通常会为 <q> 元素包围引号。
<p>WWF 的目标是：<q>构建人与自然和谐共存的世界。</q></p>
长引用
HTML <blockquote> 元素定义被引用的节。
浏览器通常会对 <blockquote> 元素进行缩进处理。
<p>以下内容引用自 WWF 的网站：</p>
<blockquote cite="http://www.worldwildlife.org/who/index.html">
五十年来，WWF 一直致力于保护自然界的未来。
世界领先的环保组织，WWF 工作于 100 个国家，
并得到美国一百二十万会员及全球近五百万会员的支持。
</blockquote>
缩略词
HTML <abbr> 元素定义缩写或首字母缩略语。
对缩写进行标记能够为浏览器、翻译系统以及搜索引擎提供有用的信息。
<p><abbr title="World Health Organization">WHO</abbr> 成立于 1948 年。</p>
定义
HTML <dfn> 元素定义项目或缩写的定义。
<dfn> 的用法，按照 HTML5 标准中的描述，有点复杂：
1. 如果设置了 <dfn> 元素的 title 属性，则定义项目：
<p><dfn title="World Health Organization">WHO</dfn> 成立于 1948 年。</p>
2. 如果 <dfn> 元素包含具有标题的 <abbr> 元素，则 title 定义项目：
<p><dfn><abbr title="World Health Organization">WHO</abbr></dfn> 成立于 1948 年。</p>
3. 否则，<dfn> 文本内容即是项目，并且父元素包含定义。
<p><dfn>WHO</dfn> World Health Organization 成立于 1948 年。</p>
注释：如果您希望简而化之，请使用第一条，或使用 <abbr> 代替。
联系信息
HTML <address> 元素定义文档或文章的联系信息（作者/拥有者）。
此元素通常以斜体显示。大多数浏览器会在此元素前后添加折行。
<address>
Written by Donald Duck.<br>
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
USA
</address>
著作标题
HTML <cite> 元素定义著作的标题。
浏览器通常会以斜体显示 <cite> 元素。
<p><cite>The Scream</cite> by Edward Munch. Painted in 1893.</p>
双向重写
HTML <bdo> 元素定义双流向覆盖（bi-directional override）。
<bdo> 元素用于覆盖当前文本方向：
<bdo dir="rtl">This text will be written from right to left</bdo>
HTML 引文、引用和定义元素
2729
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
