8.HTML基础——a标签和base标签的基本使用，假链接，锚点

最新推荐文章于 2022-06-17 15:26:33 发布

山楂不甜

最新推荐文章于 2022-06-17 15:26:33 发布

阅读量527

点赞数 2

分类专栏：笔记 html 文章标签： html5 html 前端

本文链接：https://blog.csdn.net/Veronnit/article/details/118528036

版权

笔记同时被 2 个专栏收录

60 篇文章 1 订阅

订阅专栏

html

17 篇文章 0 订阅

订阅专栏

文章目录

a标签
base标签
- target属性
假链接
锚点

a标签

作用：

用于控制页面与页面之间跳转的

格式：

< a href=“指定跳转的目标页面” >需要展示给用户查看的内容 < /a >

targe属性

作用：专门用于控制如何跳转

_self:用于在当前标签页中跳转，也就是不新建界面跳转，默认就是_self
_blank:用于跳转到新的标签页

title属性

作用：a标签的title属性和img标签的title属性一样，都是用来控制鼠标悬停时显示出来的提示文本的

注意点

a标签不仅可以让文字能够被点击，还可以让图片也能够被点击
一个a标签必须要有一个href属性，否则a标签不知道要跳转到什么地方
如果通过a标签的herf属性指定一个URL地址，那么必须在地址前面加上http://或者https://
a标签href属性除了可以指定一个网络地址以外，还可以指定一个本地地址

<a href="http://news.baidu.com/">新闻</a>
<br>
<a href="http://news.baidu.com/" target="_self">新闻</a>
<br>
<a href="http://news.baidu.com/" target="_blank">新闻</a>
<br>
<a href="http://news.baidu.com/" target="_blank" title="点击这里会跳转到百度新闻的首页">新闻</a>
<br>
<a href="https://re.taobao.com/action_ecpm_home?ali_trackid=19_44606c6d1a3897310703eea4f308918a">
  <img src="TB1.jpg" width="150">
</a>

base标签

target属性

作用：base标签中的target属性就是专门用来统一的指定当前网页中所有的超链接（a标签）需要如何打开

注意点：

base标签必须写在head标签的开始标签和结束标签之中；
如果既在base标签中指定了target又在a标签中指定了target，那么浏览器会按照a标签中指定的来执行。

<head>
    <meta charset="UTF-8">
    <title>11-base标签</title>
  <base target="_blank">
</head>
<body>
<a href="http://news.baidu.com/" target="_self">新闻</a>
<a href="https://www.hao123.com/">hao123</a>
<a href="https://map.baidu.com/@12609384.2,2631450.58,12z">地图</a>
<a href="https://live.baidu.com/">直播</a>
<a href="https://haokan.baidu.com/?sfrom=baidu-top">视频</a>
<a href="https://tieba.baidu.com/index.html">贴吧</a>

</body>

假链接

什么是假连接？

就是点击之后不会跳转的链接我们称之为假链接

假链接的意义

在企业开发期，其他页面都没有写出来，那么我们就不知道应该跳转到什么地方，所以就只能用假链接来代替
当项目后期其他界面都已经完成时，再将假链接替换为真链接
可以返回顶部

格式

< a href="#" >< /a >
< a href=“javascript:” >< /a >

两者的区别：
#的假链接会自动回到网页的顶部，而javascript:的假链接不会回到网页顶部

像京东返回顶部的按键就是#的假链接
在这里插入图片描述

锚点

作用

通过a标签跳转到当前页面的指定的位置或者是指定页面的指定位置

方法

要想通过a标签跳转到指定的位置，那么必须告诉a标签一个独一无二的身份证号码，这样a标签才能在当前页面中找到需要跳转到的目标位置；
如何给HTML中的标签绑定一个独一无二的身份证号码呢？
在HTML中，每一个标签都有一个名称叫做id的属性，这个属性就是用来给标签指定一个独一无二的身份证号码；
所以要想实现通过a标签跳转到指定的位置分为两步：

给目标位置的标签添加一个id属性，然后指定一个独一无二的值
告诉a标签你需要跳转到的目标标签对应的独一无二的身份证号码是多少

格式

<a href="#center">跳转到中部</a>
<h2 id="center">我是中部</h2>

注意点

通过我们的a标签跳转到指定的位置上，是没有过渡动画的，是直接一下子就跳转到指定位置的；
a标签除了可以跳转到当前界面的指定位置以外，还可以再跳转到其他界面的指定位置。
格式：

<a href="13-锚点测试界面.html#3" target="_blank">跳转到锚点测试界面</a>
<h2 id="3">我是锚点测试界面3</h2>

山楂不甜

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
8.HTML基础——a标签和base标签的基本使用，假链接，锚点

文章目录a标签作用：格式：targe属性title属性注意点base标签target属性假链接什么是假连接？假链接的意义格式锚点作用方法格式注意点a标签作用：用于控制页面与页面之间跳转的格式：< a href=“指定跳转的目标页面” >需要展示给用户查看的内容 < /a >targe属性作用：专门用于控制如何跳转_self:用于在当前标签页中跳转，也就是不新建界面跳转，默认就是_self_blank:用于跳转到新的标签页title属性作用：a标签的title
复制链接

扫一扫