当前位置: 首页 > 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;各种主题的…...

网络编程(Modbus进阶)

思维导图 Modbus RTU&#xff08;先学一点理论&#xff09; 概念 Modbus RTU 是工业自动化领域 最广泛应用的串行通信协议&#xff0c;由 Modicon 公司&#xff08;现施耐德电气&#xff09;于 1979 年推出。它以 高效率、强健性、易实现的特点成为工业控制系统的通信标准。 包…...

[2025CVPR]DeepVideo-R1:基于难度感知回归GRPO的视频强化微调框架详解

突破视频大语言模型推理瓶颈,在多个视频基准上实现SOTA性能 一、核心问题与创新亮点 1.1 GRPO在视频任务中的两大挑战 ​安全措施依赖问题​ GRPO使用min和clip函数限制策略更新幅度,导致: 梯度抑制:当新旧策略差异过大时梯度消失收敛困难:策略无法充分优化# 传统GRPO的梯…...

Prompt Tuning、P-Tuning、Prefix Tuning的区别

一、Prompt Tuning、P-Tuning、Prefix Tuning的区别 1. Prompt Tuning(提示调优) 核心思想:固定预训练模型参数,仅学习额外的连续提示向量(通常是嵌入层的一部分)。实现方式:在输入文本前添加可训练的连续向量(软提示),模型只更新这些提示参数。优势:参数量少(仅提…...

React Native 开发环境搭建(全平台详解)

React Native 开发环境搭建&#xff08;全平台详解&#xff09; 在开始使用 React Native 开发移动应用之前&#xff0c;正确设置开发环境是至关重要的一步。本文将为你提供一份全面的指南&#xff0c;涵盖 macOS 和 Windows 平台的配置步骤&#xff0c;如何在 Android 和 iOS…...

可靠性+灵活性:电力载波技术在楼宇自控中的核心价值

可靠性灵活性&#xff1a;电力载波技术在楼宇自控中的核心价值 在智能楼宇的自动化控制中&#xff0c;电力载波技术&#xff08;PLC&#xff09;凭借其独特的优势&#xff0c;正成为构建高效、稳定、灵活系统的核心解决方案。它利用现有电力线路传输数据&#xff0c;无需额外布…...

【快手拥抱开源】通过快手团队开源的 KwaiCoder-AutoThink-preview 解锁大语言模型的潜力

引言&#xff1a; 在人工智能快速发展的浪潮中&#xff0c;快手Kwaipilot团队推出的 KwaiCoder-AutoThink-preview 具有里程碑意义——这是首个公开的AutoThink大语言模型&#xff08;LLM&#xff09;。该模型代表着该领域的重大突破&#xff0c;通过独特方式融合思考与非思考…...

linux 错误码总结

1,错误码的概念与作用 在Linux系统中,错误码是系统调用或库函数在执行失败时返回的特定数值,用于指示具体的错误类型。这些错误码通过全局变量errno来存储和传递,errno由操作系统维护,保存最近一次发生的错误信息。值得注意的是,errno的值在每次系统调用或函数调用失败时…...

Springcloud:Eureka 高可用集群搭建实战(服务注册与发现的底层原理与避坑指南)

引言&#xff1a;为什么 Eureka 依然是存量系统的核心&#xff1f; 尽管 Nacos 等新注册中心崛起&#xff0c;但金融、电力等保守行业仍有大量系统运行在 Eureka 上。理解其高可用设计与自我保护机制&#xff0c;是保障分布式系统稳定的必修课。本文将手把手带你搭建生产级 Eur…...

从零实现STL哈希容器:unordered_map/unordered_set封装详解

本篇文章是对C学习的STL哈希容器自主实现部分的学习分享 希望也能为你带来些帮助~ 那咱们废话不多说&#xff0c;直接开始吧&#xff01; 一、源码结构分析 1. SGISTL30实现剖析 // hash_set核心结构 template <class Value, class HashFcn, ...> class hash_set {ty…...

JVM暂停(Stop-The-World,STW)的原因分类及对应排查方案

JVM暂停(Stop-The-World,STW)的完整原因分类及对应排查方案,结合JVM运行机制和常见故障场景整理而成: 一、GC相关暂停​​ 1. ​​安全点(Safepoint)阻塞​​ ​​现象​​:JVM暂停但无GC日志,日志显示No GCs detected。​​原因​​:JVM等待所有线程进入安全点(如…...