当前位置: 首页 > news >正文

HTML5+CSS前端开发【保姆级教学】+超链接标签

一、引入:

        Hello!,各位编程猿们!一个页面可以跳转到其他页面,去访问其他资源,使得我们的文档更加的灵动,那我们如何实现不同页面的跳转呢?本期主要介绍超链接标签

那么什么是超链接标签呢?

我们可以打开百度的官网页面

当我们点击新闻按钮

就会跳转到百度新闻页面

当我们点击贴吧

页面则跳转到百度贴吧,我们点击的文字按钮就是超链接

二、超链接介绍

        超链接是用于导航的一种基本元素,它允许用户通过单击跳转到其他页面或资源。它可以是一个字、一个词或者一组词,也可以是一幅图像,单击这些内容就可以跳转到新的文档或者当前文档中的某个部分。

(1)语法格式:

        <a href="链接路径">文本或图像</a>

(2)作用:

它可以跳转到指定的页面(或者网站)

(3)属性介绍:

1.href

        指定链接路径(a标签所要跳转的目标地址)

2.target

        定义目标窗口(通俗来说就是设置在浏览器打开目标网址的方式)

        用于设置当前超链接跳转的目标网址,target属性值为为_blank时,指代当前超链接标签在新的窗口打开目标网址

3.title

        定义链接提示信息

三、接下来我们用代码演示一下

首先,我们在键盘上输入a,回车

这时候我们可以看到a标签出来了

我们在href属性里面填写我们要跳转的路径,这里我们粘贴上B站的域名,并写上"哔哩哔哩"的文本

保存代码运行一下,可以看到页面上显示哔哩哔哩的文本链接,那么我们点击上面的文本链接

我们就可以看到页面会跳转到,哔哩哔哩的官网页面

  • 这里我们使用target属性,让它重新载入一个新窗口载入

现在我们看到的B站官网就是没有覆盖到原先的文本链接的页面

当然我们也可以多写一个超链接标签

我们可以发现两个超链接位于同一行

当然,如何我们不想让它们位于同一行,可以在每一句超链接标签外面,使用段落标签

运行结果,即可实现超链接标签换行效果

        注意!目标地址不光是别人的网址,还可以跳转到自己的页面,这里只需要做的事情就是把链接路径改成要跳转的绝对路径就可以了,这期内容就到这里,如果你喜欢这篇文章的话,别忘了动动小手,点赞收藏噢! 

相关文章:

  • 如何保证本地缓存和redis的一致性
  • GEO全域优化白皮书:盈达科技如何打造AI生态中的认知护城河
  • 林纳斯·托瓦兹:Linux系统之父 Git创始人
  • Python 类方法
  • C2000 ADC和DAC实验
  • Java 开发工具:从 Eclipse 到 IntelliJ IDEA 的进化之路
  • leetcode36.有效的数独
  • 大数据面试问答-Spark
  • LeetCode 1922题解(快速幂模板题)
  • 9.thinkphp的请求
  • (C语言)算法复习总结2——分治算法
  • C++之 多继承
  • 【C++11】智能指针
  • 第十六届蓝桥杯Java b组(试题C:电池分组)
  • LabVIEW 程序持续优化
  • [react]Next.js之自适应布局和高清屏幕适配解决方案
  • 2025SQCTF赛题复现
  • 泰勒公式的深入研究
  • 【信息系统项目管理师】高分论文:论信息系统项目的整合管理(旅游景区导游管理平台)
  • Laravel 使用通义灵码 - AI 辅助开发提升效率
  • 上海国际电影节纪录片单元,还世界真实色彩
  • 安徽省委常委、合肥市委书记费高云卸任副省长职务
  • 大英博物馆展歌川广重:他是梵高最钟爱的浮世绘名家
  • “11+2”复式票,宝山购彩者领走大乐透1170万头奖
  • 2025上海科技节本周六启幕,机器人和科学家同走AI科学红毯
  • 飙升至熔断,巴基斯坦股市两大股指收盘涨逾9%