a标签的用法,base标签用法

2023-10-26

在前端开发中,经常会遇到

a标签–超链接

<a> 标签定义超链接,用于从一张页面链接到另一张页面。
<a> 元素最重要的属性是 href 属性,它指示链接的目标。

超链接
<a href="http://www.baid.com" target="_blank">跳转到百度</a>
<a href="javascript:void(0)" >跳转</a> //不跳转,网页上常用
<a href="">跳转</a>  //空链接,当前页面跳转,刷新页面
<a href="#">跳转</a> //空锚点,回到最顶端,不刷新页面

//将图像作为链接
<a href="../img/footer.png" download="../img/footer.png">下载图片</a>

//mailto:会自动检测本机系统是否安装邮箱,如果有就会自动打开邮箱,
//没有则会提示用户选择邮箱或者没提示
<a href="mailto:1533233@qq.com">发送邮件</a>
<a href="tel:12345678910">一键拨打电话</a>
<a href="sms:12345678910">一键发送短信</a>

//锚点
//第一种:
<a href="#app">跳转</a>
<p id="app">锚点</p>

//第二种:
<a href="#app">跳转</a>
<a href="" name="app">跳转</a>
//这种方式只能用a标签的name属性定义才生效
a标签的href属性
  1. 如果a标签不做跳转用,只是一个标签,那么在a中调用js函数最适当的方法推荐使用:
<a href="javascript:void(0);" οnclick="js_method()"></a>
<a href="javascript:;" οnclick="js_method()"></a>
<a href="#" οnclick="js_method();return false;"></a>
  1. href="#“的作用
    a中href=”#"表示回到最顶部。如果当前页面中需要滚动的话,那么用这种方式就可以直接回到顶部。比如有些网站会在右下角制作一个图标按钮,回到顶部,那么此时可以考虑用这种最简单的方式实现。
<span style="font-size:14px;">
	<a href="#">回到最顶端</a>
</span>
  1. href="URL"的作用
//绝对地址
<a href="http://baidu.com">超链接</a>
//相对URL
<a href="css/css1.css">文件链接</a>
//锚点URL
<a href="#box">回到最顶端</a> //回到页面中id为box的元素锚点位置
a标签的target属性

_blank
_parent
_self
_top
frameName

base标签

语法:
<head>
	<base href="全局地址" target="全局属性">
</head>

target属性值:
_blank
_parent
_self
_top

定义和用法

<base> 标签为页面上的所有链接规定默认地址或默认目标

使用 标签,浏览器随后将不再使用当前文档的 URL,而使用指定的基本 URL 来解析所有的相对 URL。这其中包括 <a>、<img>、<link>、<form> 标签中的 URL。

<base> 标签必须位于 head 元素内部。

注意
<base>标签是针对所有的<a>标签起作用,如<base>标签和<a>标签都有target属性,那么遵循就近原则,最终效果取决于<a>标签中的属性。

设置了base标签的href默认地址,页面就不能轻易用 href="#" 号,这样也会造成默认地址的页面加载

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

a标签的用法,base标签用法 的相关文章

随机推荐

  • hadoop中的两个datanode节点的VERSION文件冲突,导致其中有一个datanode无法启动

    问题 分析 本来是有三个datanode才对 所以有一个datanode丢失 查看丢失的datanode的log日志 第一个报错 是datanode无法启动的报错日志 第二个报错 是因为datanode丢失 数据无法上传的报错 很奇怪的是
  • 2020年前端开发工具大全:50款热门的前端工具汇总

    今天跟大家分享一些目前比较热门新鲜度靠前的50款前端工具 希望对你有所帮助 下面和千锋广州小编一起来看看吧 一 构建工具 1 Parcel 地址 https parceljs org Parcel是一款极速零配置WEB应用打包工具 快速 几
  • Linux 根文件系统的挂载分析

    在介绍根文件系统挂载之前先介绍一些基础知识 initramfs 当linux内核启动后 会找到并执行第一个用户程序 一般是init 这个程序存在于文件系统当中 文件系统存在于设备上 但不知道init存在哪个设备上 于是有了内核命令列选项ro
  • 在Windows 10上安装WSL2

    TOC WSL2 在Windows10上安装 前提条件 是否支持Virtualization WSL2 是基于hyper V的 所以windows 机器必须支持虚拟化 如果是虚机的那就要支持嵌套的虚拟化 网上一堆看BIOS的太麻烦了 简单的
  • 【ffmpeg教程】【无损快速转换】两行代码 快速无损转换mkv flv视频文件 第一期

    ffmpeg教程 无损快速转换 两行代码 快速无损转换mkv flv视频文件 第一期 前言 环境准备 脚本编写 运行脚本 前言 视频版教程 无损快速转换 两行代码 快速无损转换mkv flv视频文件 导入Premiere教程 环境准备 工具
  • C#中得到两个数百分比 (转)

    此方法得到的百分比后小数太多 不行 double percent Convert ToDouble 2 Convert ToDouble 34 string result percent 100 ToString 得到的是5 8823529
  • 如何处理VS联合Qt没有ui_.h文件

    首先声明我使用的是VS2019 QT5 9 0 在初学VS联合QT时 发现自己VS中的资源管理器中没有ui h文件 在网上搜寻了一些解决方案 得出的大致结论就是 现在版本的VS中已经不会自动生成GeneratedFiles文件夹 那么其中的
  • 【数据结构与算法】深入浅出递归和迭代的通用转换思想

    深入浅出递归和迭代的通用转换思想 一般来说 能用迭代的地方就不要用递归 理论上讲 所有的递归和迭代之间都能相互转换 刷题碰到 一天一道LeetCode 130 Surrounded Regions所以来总结一下递归和迭代 一 何为迭代 首先
  • Microsoft365与Office到底啥区别?如何选择下载安装哪个版本?

    Microsoft 365 是一种订阅服务 可确保你始终拥有最新的 Microsoft 新式生产力工具 存在针对家庭和个人 中小型企业 大型企业 学校以及非营利组织的 Microsoft 365 计划 适用于家庭和商业的 Microsoft
  • 如何做好“向上管理”

    mghio 读完需要 10分钟 速读仅需 4 分钟 0 什么是 向上管理 向上管理用一句话来描述就是 在工作中为了取得更好的工作成果 有意识地配合你的领导一起工作的过程 请注意这里的有意识这个词 1 为什么要 向上管理 首先先来看看领导眼中
  • pthread_mutex_lock用法

    条件变量 条件变量是利用线程间共享的全局变量进行同步的一种机制 主要包括两个动作 一个线程等待 条件变量的条件成立 而挂起 另一个线程使 条件成立 给出条件成立信号 为了防止竞争 条件变量的使用总是和一个互斥锁结合在一起 条件变量是利用线程
  • 9.1-深度生成模型

    文章目录 图像处理 创作 PixelRNN 练习生成模型 自动编码器 宝可梦生成 图像处理 创作 有关generation model 这里有一篇很好的reference 在这篇reference里开头引用Richard Feynman的话
  • 【Tool】制作多系统启动盘

    前言 我一个U盘 64G的 总不能只装一个ubuntu就不能用了吧 所以百度一大堆多系统启动盘的软件 太难搞了 我灵机一动 我512G的硬盘都能分为两个区分别做系统区和存储区 为什么u盘不能分好几个区装好几系统呢 步骤 思路 把系统盘文件复
  • java smtp怎么开启_java-一个简单的本地SMTP

    java 一个简单的本地SMTP 我想测试用于发送电子邮件的Java代码 我不想使用任何商业邮件客户端或连接到任何外部邮件提供商 例如Gmail或Yahoo 我想知道是否存在允许用户配置虚拟电子邮件地址和服务器 本地 的软件 这些软件可以在
  • mac编程提示 Undefined symbol: _OBJC_CLASS_$_xxxx

    使用cocoa编程 编译提示报错 Showing All Issues Undefined symbol OBJC CLASS NSAlert 解决办法 link Binary With Libraries 添加 Foundation fr
  • TNS-12542: TNS: 地址已被占用

    TNS 12542 TNS 地址已被占用 监听该对象时出错 DESCRIPTION ADDRESS PROTOCOL TCP HOST HKY PORT 1521 TNS 12560 TNS 协议适配器错误 TNS 00512 地址已在使用
  • rocketMq中文文档

    title 用户指引 date 2017 12 29 categories 文档翻译 为什么是RocketMQ 动机 在早期阶段 我们在ActiveMQ 5 x 早于5 3 的基础上构建我们的分布式消息中间件 我们的跨国业务使用它来实现异步
  • 将Go程序打包成Docker镜像

    将Go程序打包成Docker镜像 1 Go程序 hello go 文件的内容 package main import fmt func main fmt Println hello world 2 编写Dockerfile文件 FROM g
  • 练习:可迭代的对象和四个函数—— enumerate()、zip()、map()、filter()

    Python 官网 https www python org 这里 才 python 前沿 可惜是英文原版 所以 我要练习英文阅读 我的CSDN主页 My Python 学习个人备忘录 我的HOT博 自学并不是什么神秘的东西 一个人一辈子自
  • a标签的用法,base标签用法

    在前端开发中 经常会遇到 a标签 超链接 a 标签定义超链接 用于从一张页面链接到另一张页面 a 元素最重要的属性是 href 属性 它指示链接的目标 超链接 a href http www baid com target blank 跳转