html5 - 超链接基础和锚点

最新推荐文章于 2024-04-14 20:34:11 发布

为明天

最新推荐文章于 2024-04-14 20:34:11 发布

阅读量1.4w

点赞数 7

分类专栏： html5

本文链接：https://blog.csdn.net/li5685918/article/details/50212221

版权

html5 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

超连接就是打开另外一个页面，可以是本地的，也可以是网页，也可以通过图片来打开。

一：基础超链接

<span style="font-size:14px;"><!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>超连接</title>
</head>
<body bgcolor="#fff">
	<!-- 在同一个网页内的链接-->
	<a href="http://www.baidu.com">超连接网址</a>
	<br>
	<!-- 必须在同一目录下文件全名-->
	<a href="text01.html">链接到本地</a>
	<br>
	<!-- 图片指定路径，标签嵌套-->
	<a href="http://www.360.com"><img src="指定图片.png"></a>
	<br>
	<!-- 电脑上必须安装发邮件工具-->
	<a href="mailto:2305600865@qq.com">发邮件</a>
	<br>
	<a href="下载图片.png">下载,可以指定文本和图片</a>
</body>
</html></span>

二：认识target属性，默认是在当前页面打开。如果想在新的页面打开，需要设置target="_blank"

<a href="http://www.baidu.com" target="_blank">打开新窗口</a>

三：锚点链接，所谓锚点链接就是在同一个页面跳到指定位置的方式。这里需要认识一下id。id在同一个html页面中是唯一的。又id当然有名字name,name可以理解为元素的内容。方法，首先通过a标签定义链接，a标签内href改为id.

<a href="#1">锚点1</a>

在需要的地方定义锚点

<a id="1">锚点1</a>

全部代码：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>超连接学习02</title>
</head>
<body bgcolor="#fff">
	<!-- target
	_self默认，当前网页
	_blank打开新窗口
	-->
	<a href="http://www.baidu.com" target="_blank">打开新窗口</a>

	<!-- 锚点链接-->
	<a href="#1">锚点1</a>
	<a href="#abc">锚点2</a>
	<a href="#d10">锚点3</a>
		<br><br><br><br><br><br>
		<!-- id属性在同一个html中是唯一的-->
		<a id="1">锚点1</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>
		<a id="abc">描点2</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>
		<a id="d10">描点3</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><br><br><br><br>
</body>
</html>

效果：

为明天

关注

7
点赞
踩
13

收藏

觉得还不错? 一键收藏
1
评论
html5 - 超链接基础和锚点

超连接就是打开另外一个页面，可以是本地的，也可以是网页，也可以通过图片来打开。一：基础超链接超连接超连接网址链接到本地发邮件下载,可以指定文本和图片二：认识target属性，默认是在当前页面打开。如果想在新的页面打开，需要设置target="_blank"打开新窗口三：锚点链接，所谓锚点链接就是在同一个页面跳到指定
复制链接

扫一扫