图像
img 元素向网页中嵌入一幅图像。
语法
<img src="" alt="" /> img标签常用属性
src 跳转的url
alt 图片不显示时显示的文字
height 图像的高，可以为像素和百分比
width 图像的宽，可以为像素和百分比 
<html >
<head>
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
</head>
<body>
<img src="http://img3.cache.netease.com/photo/0001/2016-04-26/BLJL1S1I00AO0001.jpg" alt="我是图片" width="20%" height="30%">
</body>
</html> View Code
超链接标签
语法
<a href="">内容</a>
href:链接地址，可以是内部链接或外部链接 <html >
<head>
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
</head>
<body>
<a href="https://cn.bing.com/">点我</a>
</body>
</html> View Code
上面的代码我们发现是在当前页面打开了超链接，如果想在新页面打开，只需要加上target="_blank"
<html >
<head>
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
</head>
<body>
<a href="https://cn.bing.com/" target="_blank">点我</a>
</body>
</html> View Code
常用属性
href 链接地址
target 链接的目标窗口，_self在当前页面打开，_blank在新窗口打开
title 链接提示文字
name 链接命名 链接提示文字
作用：鼠标放到超链接上，会有提示
<html >
<head>
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
</head>
<body>
<a href="https://cn.bing.com/" target="_blank" title="这是必应网站">点我</a>
</body>
</html> View Code
锚
作用：跳转到想要到达的位置
语法
<a href="#锚名1">目录1</a>
<a href="#锚名2">目录2</a>
<a href="..." name="锚名1">内容1</a>
<a href="..." name="锚名2">内容2</a> <html >
<head>
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
</head>
<body>
<a href="#menu1">点我到达目录一</a>
<a href="#menu2">点我到达目录二</a>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a name="menu1"><p>目录一</p></a>
<a >目录一的内容</a>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a name="menu2"><p>目录二</p></a>
<a >目录二的内容</a>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</body>
</html> View Code
不同页面定义锚
语法
<a href="网页名称#锚名1">目录1</a>
<a href="..." name="锚名1">内容1</a> 我们在相同的文件夹下在写一个HTML页面，上面的起名为01.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
</head>
<body>
<a href="01.html#menu2">点我达到另一个页面</a>
</body>
</html> 电子邮件链接
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
</head>
<body>
<a href="mailto:[email protected]">邮件链接</a>
</body>
</html> 文件下载
通常在咱们写项目的时候会遇到上传下载什么的，在上传完文件后会把文件的路径保存到数据库里以便下载，如果想不通过后台直接下载的话，可以把文件路径给a标签的属性href；
<a href="/user/test/xxxx.txt">点击下载</a> 这样当用户打开浏览器点击链接的时候就会直接下载文件。
但是有个情况，比如txt,png,jpg等这些浏览器支持直接打开的文件是不会执行下载任务的，而是会直接打开文件，这个时候就需要给a标签添加一个属性“download”；
<a href="/user/test/xxxx.txt" download="文件名.txt">点击下载</a> 这里download也可以不写任何信息，会自动使用默认文件名