51工具盒子1.链接标签
1.1 a标签
使用"a标签"来实现超链接 语法：
<a href="链接地址">文本或图片</a>
我们可以将文本设置为超链接，这个叫做"文本超链接"。也可以将图片设置为超链接，这个叫做"图片超链接"。
案例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>超链接</title>
</head>
<body>
<a href="http://class.huaruiedu.wang">华瑞智慧校园</a><br />
<a href="http://class.huaruiedu.wang">
<img src="img/hr.jpg" width="100"/>
</a>
</body>
</html>
1.2 target属性
默认情况下，超链接都是在当前浏览器窗口打开新页面的。在HTML中，我们可以使用target属性来定义超链接打开窗口的方式
语法：
<a href="链接地址" target="打开方式"></a>
target属性:
_self == 默认值，在原来的窗口打开链接
_blank == 在新窗口打开链接
_parent == 在父窗口打开链接
_top == 在顶层窗口打开超链接
1.3 内部链接
超链接有两种：一种是外部链接；另外一种是内部链接。外部链接指向的是"外部网站的页面"，而内部链接指向的是"自身网站的页面"
案例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>内部链接</title>
</head>
<body>
<a href="taobao.html"><h1>去桃宝</h1></a>
<a href="jd.html"><h1>去金东</h1></a>
</body>
</html>
1.4 锚点链接
**锚点链接其实是内部链接的一种，它链接地址（也就是href）指向的是当前页面的某个部分。所谓的锚点链接，简单来说，就是点击某一个超链接，然后它就会跳到当前页面的某一部分。 **案例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>锚点</title>
</head>
<body>
<p>
<a href="#推荐文章">推荐文章</a><br />
<a href="#推荐音乐">推荐音乐</a><br />
<a href="#推荐电影">推荐电影</a><br />
</p>
......<br />
......<br />
......<br />
......<br />
......<br />
......<br />
......<br />
......<br />
<p>
<h3 id="推荐文章">推荐文章</h3>
1.余光中-乡愁<br/>
2.朱自清-荷塘月色<br/>
3.鲁迅-阿Q正传<br/>
</p>
......<br />
......<br />
......<br />
......<br />
......<br />
......<br />
......<br />
......<br />
<p>
<h3 id="推荐音乐">推荐音乐</h3>
1.刘德华-中国人<br/>
2.华瑞校歌-梦想的翅膀<br/>
3.宋祖英-好日子<br/>
</p>
......<br />
......<br />
......<br />
......<br />
......<br />
......<br />
......<br />
......<br />
<p>
<h3 id="推荐电影">推荐电影</h3>
1.武侠系列<br/>
2.复仇者联盟<br/>
3.奥特曼系列<br/>
</p>
<p align="right"><a href="mailto:[email protected]">联系我们</a></p>
</body>
</html>
1.5 功能性链接
语法：
<a href="mailto://邮箱地址" >给指定邮箱地址发送信息</a>
案例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>锚点</title>
</head>
<body>
<p align="right"><a href="mailto:[email protected]">联系我们</a></p>
</body>
</html>
2.列表
列表是网页中最常用的一种数据排列方式，HTML中列表共有3种：有序列表、无序列表和定义列表
2.1 有序列表
有序列表中的各个列表项是有顺序的。有序列表从<ol>开始，到</ol>结束。有序列表的列表项是有先后顺序的，一般采用数字或字母作为顺序，默认是采用数字顺序 语法：
<ol>
<li>列表值1</li>
<li>列表值2</li>
<li>列表值3</li>
...
</ol>
案例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>有序列表</title>
</head>
<body>
<h1>有序列表</h1>
<ol>
<li>JAVA</li>
<li>HTML</li>
<li>JavaScript</li>
<li>... </li>
</ol>
</html>
有序列表的type属性
1 == 阿拉伯数字 1，2，3，4
a == 小写英文字母 a,b,c,d
A == 大写英文字母 A，B,C,D
i == 小写罗马数组i,ii,iii...
I == 大写罗马数字 I,II,III...
2.2无序列表
无序列表，很好理解，有序列表的列表项是有一定顺序的，而无序列表的列表项是没有顺序的。默认情况下，无序列表的列表项符号是●
语法：
<ul>
<li>列表值1</li>
<li>列表值2</li>
<li>列表值3</li>
...
</ul>
案例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>无序列表</title>
</head>
<body>
<h1>软件下载</h1>
<ul>
<li>windows xp</li>
<li>windows 7</li>
<li>windows 8</li>
<li>windows 10</li>
<li>windows 11</li>
</ul>
</body>
</html>
无序列表的type属性
disc == 实心圆●(默认值)
circle == 空心圆○
square == 正方形■
2.3 定义列表
定义列表由两部分组成：名词和描述 语法：
<dl>
<dt>名词</dt>
<dd>描述</dd>
......
</dl>
案例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>定义列表</title>
</head>
<body>
<dl>
<dt>HTML</dt>
<dd>制作网页的标准语言，控制网页的结构</dd>
<dt>CSS</dt>
<dd>层叠样式表，控制网页的样式</dd>
<dt>JavaScript</dt>
<dd>脚本语言，控制网页的行为</dd>
</dl>
</body>
</html>
