04. html 超链接 a标签

最新推荐文章于 2024-02-15 17:19:58 发布

lizhoutx1

最新推荐文章于 2024-02-15 17:19:58 发布

阅读量239

点赞数

本文链接：https://blog.csdn.net/weixin_43475526/article/details/83388365

版权

HTML基础专栏收录该内容

7 篇文章 0 订阅

订阅专栏

html 超链接 a标签

超链接 a 标签的使用
a标签配合 name 锚点的使用
base标签的使用

超链接 a 标签的使用

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>HTML超链接</title>
</head>
<body>
	<a href="https://www.baidu.com" target="_self" title="">点击跳转百度</a>
	<br>
	<br>
	<a href="https://www.baidu.com" target="_blank" title="">点击跳转百度-新窗口打开</a>

	<!-- 
		a超链接
			target - 打开方式
				_blank	新窗口打开
				_self	默认窗口打开
	 -->
</body>
</html>

a标签配合 name 锚点的使用

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>a链接_锚点name</title>
	<style type="text/css">
		.item{
			display: block;
			width: 500px;
			height: 500px;
			border: 1px solid #ccc;
			text-align: center;
			line-height: 500px;
		}
	</style>
</head>
<body>
	<!-- 上面 a 标签的 href属性  对应下面的 name 属性 -->
	<a href="#item1" title="">百步飞剑</a>
	<a href="#item2" title="">夜尽天明</a>
	<a href="#item3" title="">诸子百家</a>
	<a href="#item4" title="">万里长城</a>
	<a href="#item5" title="">君临天下</a>

	<a href="#" class="item" name="item1" title="">百步飞剑</a>
	<a href="#" class="item" name="item2" title="">夜尽天明</a>
	<a href="#" class="item" name="item3" title="">诸子百家</a>
	<a href="#" class="item" name="item4" title="">万里长城</a>
	<a href="#" class="item" name="item5" title="">君临天下</a>
</body>
</html>

base标签的使用
作用，控制页面的所有a链接是否新窗口打开

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>base标签</title>
	<base target="_blank">
</head>
<body>
	<a href="http://www.baidu.com" title="">点击跳转百度</a><br>
	<a href="https://www.imooc.com/" title="">点击跳转慕课网</a><br>
	<a href="https://music.163.com/" title="">点击跳转网易云音乐</a>
</body>
</html>

lizhoutx1

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
04. html 超链接 a标签

html 超链接 a标签目录超链接 a 标签的使用a标签配合 name 锚点的使用base标签的使用超链接 a 标签的使用&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;HTML超链接&lt;/title&a
复制链接

扫一扫