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

前端-基础 常用标签-超链接标签( 锚点链接 )

锚点链接 :  点击链接,可以快速定位到 页面中的某个位置 

如果不好理解,讲一个例子,您就马上明白了 

===>>>

                        

                        这个是 刘德华的百度百科 ,可以看到,页面里面有很多内容,那就得有个目录了

                        而这个目录里显示的,就是锚点链接,就是当你点击这个链接,就会直接跳转至相

                        应的链接页面~!! (就不用 自己一直往下滑,滑好久才能滑到的内容了 )

                        这就是 锚点链接 ~!!! 

实现 锚点链接 

        #  第一步 :  在链接文本的 href 属性中,设置属性值为 #名字 的形式,

                              如   <a href="#two"> 第二集</a> 

                             

                              (这一步就是,你要点击链接,那你就得先有这个链接呀; 而点击这个链接会去

                              往相应的位置,那就是说这个链接肯定也要有相应的属性,就是 href 后面会有

                              #名字  ,这个 名字 可以随意起,是用来做标识的,但前面的 # 必须有 )

                              所以,上示的例子中, two 就是那个名字,就是那个标识 ~~!! 

                                 

        #  第二步 :  找到目标位置标签,里面添加一个  id 属性 = 刚才的名字

                              如 <h3 id="two">第二集介绍</h3>    

                              然后,就是找到要跳转相应位置的那里,

                              给它的标签添加一个 id="第一步的名字 即可~!! 

示例 : 

              

              我们先做个 小示例,先做个小网页 

             

              它是上示这样子的~! 

              然后,我们再做 锚点链接 的两步 ;我们以 人物评价为例来做 锚点链接

              根据实现 锚点链接的两步来做 

              

              上示即为 锚点链接的第一步,注意 属性里的代码是如何表示 锚点链接的第一步的~!

              ===>>>

              

              然后,我们进行锚点链接的第二步, 找到要直接跳转到位的那个地方

              也即 我们示例中的 人物评价 ( 它原本仅是一个 h3 标题 ) 

              现在给它的 h3 标签上    添加属性  id 即 第一步里的 名字 ;  如上示 

              ===>>>

            

             

              就可以看到, 人物评价明显有了链接的样式,点击,便直接跳转到相应位置~! 

相关文章:

前端-基础 常用标签-超链接标签( 锚点链接 )

锚点链接 &#xff1a; 点击链接&#xff0c;可以快速定位到 页面中的某个位置 如果不好理解&#xff0c;讲一个例子&#xff0c;您就马上明白了 >>> 这个是 刘德华的百度百科 &#xff0c;可以看到&#xff0c;页面里面有很多内容&#xff0c;那就得有个目录了 …...

2024--Django平台开发-基础信息(一)

一、前置知识点 - Python环境搭建 (Python解释器、Pycharm、环境变量等) - 基础语法(条件、循环、输入输出、编码等) - 数据类型(整型、布尔型、字符串、列表、字典、元组、集合等) - 函数(文件操作、返回值、参数、作用域等) - 面向对象 (类、对象、封装、继承、多态等)包和模…...

C++力扣题目--94,144,145二叉树递归遍历

思路 这次我们要好好谈一谈递归&#xff0c;为什么很多同学看递归算法都是“一看就会&#xff0c;一写就废”。 主要是对递归不成体系&#xff0c;没有方法论&#xff0c;每次写递归算法 &#xff0c;都是靠玄学来写代码&#xff0c;代码能不能编过都靠运气。 本篇将介绍前后…...

开源游戏引擎:创造无限可能 | 开源专题 No.56

godotengine/godot Stars: 62.6k License: MIT Godot Engine 是一个功能强大的跨平台游戏引擎&#xff0c;可用于创建 2D 和 3D 游戏。它提供了一套全面的常见工具&#xff0c;让用户可以专注于制作游戏而不必重复造轮子。该引擎支持将游戏一键导出到多个平台上&#xff0c;包…...

MyBatisPlus学习一:快速入门

前言 前面快速学习了Mybatis&#xff0c;现在开始快速学习MyBatisPlus 学习教程&#xff1a; 黑马mybatis教程全套视频教程&#xff0c;2天Mybatis框架从入门到精通 黑马程序员最新MybatisPlus全套视频教程&#xff0c;4小时快速精通mybatis-plus框架 简介 MyBatisPlus 是…...

2024最新外贸建站:ChemiCloud主机购买使用及自建外贸独立站教程

随着电商平台竞争的加剧&#xff0c;许多外贸从业者意识到减少对平台依赖的重要性&#xff0c;并选择搭建自己的外贸独立站来获得更多的控制权和灵活性。即使是没有建站基础的新手&#xff0c;也可以通过学习建站来实现这一目标。下面是一个适用于新手的外贸建站教程&#xff0…...

校招社招,认知能力测验,③如何破解语言常识类测试题?

作为认知能力测评中的一个环节&#xff0c;语言常识类&#xff0c;是大概率的出现&#xff0c;不同的用人单位可能略有不同&#xff0c;语言是一切的基础&#xff0c;而常识则意味着我们的知识面的宽度。 语言常识类的测试&#xff0c;如果要说技巧&#xff1f;难说....更多的…...

了解一下InternLM2

大模型的出现和发展得益于增长的数据量、计算能力的提升以及算法优化等因素。这些模型在各种任务中展现出惊人的性能&#xff0c;比如自然语言处理、计算机视觉、语音识别等。这种模型通常采用深度神经网络结构&#xff0c;如 Transformer、BERT、GPT&#xff08; Generative P…...

关于使用统一服务器,vscode和网页版jupyter notebook的交互问题

autodl 查看虚拟环境 在antodl上租借了一个服务器&#xff0c;通过在网页上运行jupyter notebook和在vscode中运行&#xff0c;发现环境都默认的是miniconda3。 conda info --envs 当然环境中所有的包都是一样的。 要查看当前虚拟环境中安装的所有包&#xff0c;可以使用以…...

Linux22.04系统安装显卡驱动,cuda,cudnn流程

1. 安装显卡驱动 ubuntu-drivers deices显示所有适配显卡的驱动型号&#xff0c;recommended为推荐安装 安装 sudo apt install nvidia-driver-440重启 sudo reboot验证 nvidia-smi2. 安装cuda 在 CUDA Toolkit 的下载页面选择系统版本和安装方式&#xff0c;下载并运行…...

【常考简答题】操作系统

目录 1、什么是进程 2、创建进程步骤 3、什么是死锁 4、死锁四个必要条件 5、什么是内存管理 6、内存管理功能 7、进程的三个基本状态转化图 8、操作系统为什么引入线程 9、什么是对换技术&#xff0c;好处是什么 10、DMA直接存取控制工作方式流程图 11、什么是假脱…...

Large Language Models Paper 分享

论文1&#xff1a; ChatGPTs One-year Anniversary: Are Open-Source Large Language Models Catching up? 简介 2022年11月&#xff0c;OpenAI发布了ChatGPT&#xff0c;这一事件在AI社区甚至全世界引起了轰动。首次&#xff0c;一个基于应用的AI聊天机器人能够提供有帮助、…...

微信小程序实战-01翻页时钟-1

文章目录 前言需求分析功能设计界面设计界面结构设计界面样式设计 逻辑设计 单页功能实现运行结果 前言 我经常在手机上用的一款app有一个功能是翻页时钟&#xff0c;基于之前学习的小程序相关的基础内容&#xff0c;我打算在微信小程序中也设计一个翻页时钟功能&#xff0c;J…...

BigDecimal的性能问题

BigDecimal 是 Java 中用于精确计算的数字类&#xff0c;它可以处理任意精度的小数运算。由于其精确性和灵活性&#xff0c;BigDecimal 在某些场景下可能会带来性能问题。 BigDecimal的性能问题 BigDecimal的性能问题主要源于以下几点&#xff1a; 内存占用&#xff1a;BigDec…...

Defi安全-Monox攻击事件Foundry复现

其它相关内容可见个人主页 Mono攻击事件的介绍见&#xff1a;Defi安全–Monox攻击事件分析–phalconetherscan 1. 前情提要和思路介绍 Monox使用单边池模型&#xff0c;创建的是代币-vCash交易对&#xff0c;添加流动性时&#xff0c;只需添加代币&#xff0c;即可进行任意代…...

大二上总结和寒假计划

&#x1f442; Start Again - Connor Price/Chloe Sagum - 单曲 - 网易云音乐 &#x1f442; 年年 - 徐秉龙 - 单曲 - 网易云音乐 目录 &#x1f33c;前言 &#x1f44a;成长 &#xff08;1&#xff09;情感 &#xff08;2&#xff09;运动 &#xff08;3&#xff09;穿搭…...

使用 pdfh5 实现 pdf 预览功能

1. 安装 npm install pdfh5 2. 使用 html部分&#xff1a; <div id"showPdf" style"width: 100%;"></div> js部分&#xff1a; <script> //合同展示组件 import Pdfh5 from pdfh5 //合同组件样式 import pdfh5/css/pdfh5.css expo…...

HttpRunner辅助函数debugtalk.py

辅助函数debugtalk.py Httprunner框架中&#xff0c;使用yaml或json文件进行用例描述&#xff0c;无法做一些复杂操作&#xff0c;如保存一些数据跨文件调用&#xff0c;或者实现一些复杂逻辑判断等&#xff0c;为了解决这个问题&#xff0c;引入了debugtalk.py辅助函数来进行一…...

PC端扫描小程序二维码登录

1、获取二维码地址&#xff0c;通过请求微信开发者文档中的服务端获取无限制小程序二维码URL #controller层 import org.apache.commons.codec.binary.Base64;/*** 获取小程序二维码*/PassTokenGetMapping("/getQrCode")public AjaxResult getQrCode(BlogUserDto bl…...

计算机毕业设计 | SpringBoot+vue移动端音乐网站 音乐播放器(附源码)

1&#xff0c;项目背景 随着计算机技术的发展&#xff0c;网络技术对我们生活和工作显得越来越重要&#xff0c;特别是现在信息高度发达的今天&#xff0c;人们对最新信息的需求和发布迫切的需要及时性。为了满足不同人们对网络需求&#xff0c;各种特色&#xff0c;各种主题的…...

Flutter 中的 Stream:异步编程的利器

在Flutter中&#xff0c;异步编程是非常重要的一部分&#xff0c;特别是在处理用户输入、网络请求或其他涉及时间的操作时。Flutter提供了一种强大的工具&#xff0c;称为Stream&#xff0c;用于简化异步编程的过程。 什么是 Stream&#xff1f; Stream是一种用于处理异步数据…...

2023 波卡年度报告选读:Polkadot SDK 与开发者社区

原文&#xff1a;https://dashboards.data.paritytech.io/reports/2023/index.html#section6 编译&#xff1a;OneBlock 编者注&#xff1a;Parity 数据团队发布的 2023 年 Polkadot 年度数据报告&#xff0c;对推动生态系统的关键数据进行了深入分析。报告全文较长&#xff…...

深入了解Go语言中的unsafe.Sizeof():探究变量与数据类型的内存占用

当涉及到在 Go 语言中确定变量或数据类型所占用的内存空间大小时&#xff0c;unsafe 包中的 Sizeof() 函数成为了一个强有力的工具。它可以用来获取变量或数据类型所占用的字节数&#xff0c;但需要注意的是&#xff0c;它不考虑内存对齐和填充的情况。因此&#xff0c;在使用 …...

安卓上使用免费的地图OpenStreetMap

前一段使用了微信的地图&#xff0c;非常的好用。但是存在的问题是海外无法使用&#xff0c;出国就不能用了&#xff1b; 其实国内三家&#xff1a;百度&#xff0c;高德&#xff0c;微信都是一样的问题&#xff0c;当涉及到商业使用的时候需要付费&#xff1b; 国外除了谷歌…...

基于Java SSM框架实现时间管理系统项目【项目源码+论文说明】

基于java的SSM框架实现时间管理系统演示 摘要 随着科学技术的飞速发展&#xff0c;各行各业都在努力与现代先进技术接轨&#xff0c;通过科技手段提高自身的优势&#xff1b;对于时间管理系统当然也不能排除在外&#xff0c;随着网络技术的不断成熟&#xff0c;带动了时间管理…...

Mac安装upx及不同os计算md5值

Mac安装upx 最近需要将exe文件打包到pod内部&#xff0c;为了减少包占用磁盘空间&#xff0c;需要借用upx对windows exe文件进行压缩。 1 概念&#xff1a;压缩工具 UPX 全称是 “Ultimate Packer for eXecutables”&#xff0c;是一个免费、开源、编写、可扩展、高性能的可执行…...

Qt/C++编写视频监控系统82-自定义音柱显示

一、前言 通过音柱控件实时展示当前播放的声音产生的振幅的大小&#xff0c;得益于音频播放组件内置了音频振幅的计算&#xff0c;可以动态开启和关闭&#xff0c;开启后会对发送过来的要播放的声音数据&#xff0c;进行运算得到当前这个音频数据的振幅&#xff0c;类似于分贝…...

SpringBoot 如何 配置端口号

结论 server:port: 8088演示 [Ref] 快速构建SpringBoot项目...

跟随chatgpt从零开始安装git(Windows系统)

为什么我们要安装Git&#xff1f;Git有什么用&#xff1f; 1. 版本控制&#xff1a;Git 可以追踪代码的所有变化&#xff0c;记录每个提交的差异&#xff0c;使您能够轻松地回溯到任何历史版本或比较不同版本之间的差异。 2. 分支管理&#xff1a;通过 Git 的分支功能&#xff…...

C++类与对象基础(6)

(注&#xff1a;本篇文章介绍部分内容时&#xff0c;需要用到上盘文章中日期类的代码&#xff0c;文章链接如下&#xff1a;C类与对象基础(5)——日期类的实现-CSDN博客​​​​​​&#xff09; 目录 1. 运算符重载的相关补充&#xff1a; 1.1流运算符重载出现的问题&#x…...

龙岗网站建设 公司推广/微信公众号seo

KVC之-setValue:forKey:方法实现原理与验证 - (void)setValue:(id)value forKey:(NSString *)key方法,实现原理与验证 功能:使用一个字符串标示符给一个对象的属性赋值.它支持普通对象和集合对象 这个方法的默认实现如下: (1).首先去接收者(调用方法的那个对象)的类中查找与key…...

wordpress 无效登陆/新手做网络销售难吗

MySQL为开源数据库&#xff0c;因此可以基于源码实现安装。基于源码安装有更多的灵活性。也就是说我们可以针对自己的硬件平台选用合适的编译器来优化编译后的二进制代码&#xff0c;根据不同的软件平台环境调整相关的编译参数&#xff0c;选择自身需要选择不同的安装组件&…...

买完阿里云域名如何做网站/迅雷磁力链bt磁力天堂下载

阿里云服务器现在不能通过25端口发邮件【推荐阅读:阿里云服务器不能发邮件(二)】&#xff0c;即不通过php函数的方式发邮件&#xff0c;很多人都有这个问题 今天帮一兄弟解决阿里云服务器discuz不能发邮件的问题&#xff0c;之前也有人找我帮忙解决&#xff0c;现在把解决思路写…...

建站公司外贸/长沙本地推广平台

全局临时表&#xff1a; ##T1 局部临时表&#xff1a; #T1 表变量&#xff1a; T1 临时表 vs 表变量&#xff1a;可见性,持久性,性能&#xff08;具体见下表&#xff09; 临时表有统计信息可以支持优化 表变量不需要重新编译 Table 2-4: Comparison Summary Functionality/Obj…...

做药物分析网站/做网站的软件有哪些

Linux操作系统的hostname是一个kernel变量&#xff0c;可以通过hostname命令来查看本机的hostname。也可以直接cat /proc/sys/kernel/hostname查看。 #hostname #cat /proc/sys/kernel/hostname   上面两种输出结果相同。   修改运行时Linux系统的hostname&#xff0c;即…...

优化方案物理必修三电子版/广州seo和网络推广

我在Python中遇到问题&#xff0c;为此我找不到任何干净的解决方案...在调用某些方法时&#xff0c;我想在方法执行之前和之后执行一些代码。为了(除其他外)自动设置和清理context变量。为了实现这一点&#xff0c;我已经宣布了以下元类&#xff1a;class MyType(type):def __n…...