锚点使用和置顶

最新推荐文章于 2022-06-07 16:24:54 发布
最新推荐文章于 2022-06-07 16:24:54 发布
阅读量577 收藏
点赞数
分类专栏： J2EE学习 文章标签： QQ HTML
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lsh_li/article/details/83359602
版权
[color=black]测试时，本人编写两个html文件[/color] 

<!-- 第一个html -->
<html>
<head>
<title>03-07html练习</title>
</head>
<body bgcolor="#666666" alink="#000099" link="#00FF00" text="#FFFF00">
<a name="01"></a>
<a href="mail2.html">mail2.html</a><br>
		<br>
		<a href="#test">我会努力的！</a><br>
		我会努力的！<br>
		我会努力的！<br>
		我会努力的！<br>
		<!-- 测试时中间还可以再加 "我会努力的！<br>" -->
		我会努力的！<br>
		我会努力的！<br>
		我会努力的！<br>
		我会努力的！<br>
		<a name="test">我会努力的！</a><br>
		<hr>
		<a href="#01">我要回去！</a><br>
		我会努力的！<br>
		我会努力的！<br>
		我会努力的！<br>
		<!-- 测试时可以再加很多 "我会努力的！<br>" -->
		我会努力的！<br>
		我会努力的！<br>
		我会努力的！<br>
		<a href="javascript:scroll(0,0)" title="顶端" >顶端</a>
</body>
</html>



<!-- 第二个html -->
<html>
	<head>
		<!--
		<meta http-equiv="refresh" content="3; url=mail2.html">
		 -->
		<meta http-equiv="refresh" content="3">
	</head>
	<body>
		<p>This is some text in a very short paragraph</p>
		<a href="mailto:lsh_li@163.com">lsh_li@163.com</a>
		<br>
		<a href="mailto:kentrexs@sohu.com?subject=kentrexs@sohu.com">kentrexs@sohu.com</a>
		<br>
		<br>
		<table border="0" width="100%" bordercolor="#0000FF" bgcolor="#COCOCO">
			<tr>
				<td width="100%">
					<p align="center">你好吗？
				</td>
			</tr>
		</table> 
		<br>
		<br>
		<marquee width="200" height="100" direction="right" behavior="alternate">碧云轩-QQ家园</marquee> 
		<br>
		<a href="http://ditu.google.cn/maps?hl=zh-CN&tab=wl" class=gb1>地图</a>
		<br>
		<p>
		<br>
		<a href="../Boards.asp">首页</a> >> <a href="../Boards.asp">∮月儿柔如水≈</a> >> <a href="../User/Default.asp">论坛控制面板</a> >> 用户登录<br>
		<a href="03-07.html#test">回到第一个html去</a>
	</body>
</html>
lsh_li
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
微信小程序-导航吸顶+view锚点
Strive-luo的博客
04-11 1915
微信小程序--导航吸顶+view锚点导航栏滑动定位+view锚点效果图实现原理WXMLWXSS主页面JS-主页面JS-主页面子页面-newcontent子页面-sticky子页面-uploadfile 导航栏滑动定位+view锚点 我们在做小程序的时候，难免会遇到页面里面有很长的数据，页面下面又有到导航栏部分；用户希望页面滑动到导航栏的位置，导航栏固定在页面的最上面，同时里面的数变化，也能改变导航...
Vue进阶（九十九）：页面锚点至顶部
IT全栈 华强工作室
02-29 2665
应用场景 在做vue项目时，发现路由跳转之后，页面默认停留在当前浏览的位置，但是很多时候我们想要的是路由跳转之后，页面重新定位到顶部，下面介绍一下可以实现的方法。 方式一 在main.js 中添加代码： router.afterEach((to, from, next) => { window.scrollTo(0, 0) }) 方式二 如果需要某个页面跳转回顶部，仅需要在当前页面（p...
<a>标签锚点，置顶置底
独茧
02-13 1956
锚点
css锚点定位被顶部固定导航栏遮住的解决方案
风华绝代的博客
05-28 2372
<html xml:lang="cn" lang="cn"> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <meta name="keywords" content="anchor,fixed navigation hide anchor"> <link rel="stylesheet" href="https://qid..
锚点实现回到顶部的操作
cream66的博客
04-14 3088
1.通过a标签实现 <a>元素(或HTML锚元素, Anchor Element)通常用来表示一个锚点/链接。但严格来说，<a>元素不是一个链接，而是超文本锚点，可以链接到一个新文件、用id属性指向任何元素。如果没有<a>元素没有href属性的话，可以作为原本链接位置的占位符，常用于home链接。 <body> <div id="header"></div> <a href="#header" style="pos
微信小程序设置锚点定位，wx.pageScrollTo
前端
06-07 9828
微信小程序中使用 wx.pageScrollTo({)}；进行页面锚点定位
菜单置顶swiperjq锚链接
10-29
在IT行业中，Swiper.js和jQuery是两种广泛使用的前端库，它们在网页设计和开发中扮演着重要角色。Swiper.js是一款强大的触摸滑动组件，主要用于创建滑块、轮播图、幻灯片等交互式内容，而jQuery则是一个轻量级的...
电影链接
02-12
HTML是构建网页的基础，它允许开发者使用特定的标签来创建交互式和动态的用户体验。在这个名为"Cinema-Links-main"的项目中，我们可以推测它可能是一个关于构建电影相关网页的示例或教程。 首先，我们来深入了解...
简单风格的wordpress博客主题 v3.9
10-24
简单风格的wordpress博客主题虽然易秀购主题网在收集到这款模板的时候作者说这款wordpress主题适合博客主题，但是我个人觉得更像是资讯和新闻类主题，该模板有置顶文章和浮动导航等功能，界面比较简单，值得注意的是...
响应式导航有哪几类设计方式
03-03
置顶(或“放任自流”)页脚锚点菜单选择开关侧滑置底彻底隐藏上述每种设计模式都各有利弊，大家在选择导航设计方案时，需要根据项目的实际情况作出判断。将导航置顶或让导航随布局任意流动(放任自流)是一种最简单的...
vue锚点定位（代码通用） - 总结篇
草巾冒小子的博客
04-15 5135
vue锚点定位（场景案例） 跨页面锚点 当前页面锚点 vue hash模式下的锚点 vue history模式下的锚点 相关文章 https://segmentfault.com/q/1010000007888351
解决点击 锚点置顶内容 被导航遮挡
前端和PHP学习
05-24 1068
工作中我第一次遇到这种情况，因为是接手公司的老项目，在原来项目的基础上修改，而且这项目里的相应文件都非常乱，结构、样式、行为都不分离的，处理起来有点棘手，看着代码脑袋都疼；由于点击锚点，内容会默认置顶，被导航栏遮住。一开始我都在网上找解决的方案，但是后来，我还是选择了一个比较笨的办法，就是将锚点所在的元素独立出来如下： <a name="anchor"style="display:block;height:44px;margin-top:-44px;"></a> 给锚点所在元.
锚点滚动效果
艾小逗
04-15 233
锚点滚动效果 点击锚点后滚动效果 $('a[href*=#],area[href*=#]').click(function() { if(location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) { va...
vue中设置锚点，定位到固定位置
weixin_48398799的博客
05-25 1776
<template> <div class="wrap"> <ul> <li><a href="javascript:void(0)" @click="goAuchor('#one')">第一</a></li> <li><a href="javascript:void(0)" @click="goAuchor('#two')">第二</a></li
Vue监听滚动实现锚点定位（双向）
热门推荐
shentibeitaokong的博客
05-21 5万+
这里很感谢 http://www.jb51.net/article/110325.htm 这篇文章带来的启发 但是我和他不同，网上的方法都是 这样计算滚动条距离窗口顶部的距离，注意是窗口，用的是document对象 // Chrome document.body.scrollTop // Firefox document.documentElement.scrollTop ...
html/js定位到锚点(单页hash跳转)
vcxiaohan的博客
02-28 1万+
锚点 * {margin: 0; padding: 0;} h1 {background: blue;} h1 > strong {background: red;} 锚点 1 1 1 1 1 1 1 1 1 1 1
锚链接页面跳转其他页面指定位置
张井乙ccccyc的博客
07-29 1万+
用锚链接跳转其他页面指定位置 本文是我做项目时遇到的问题，解决后在这里与大家分享，欢迎指正不足的地方，更欢迎与我分享更好的解决办法！！如果不知道锚链接是神马请点击这里
导航定位(利用锚点和jquery定位)
qq_36529459的博客
05-17 3701
在网页中，点击按钮就会跳转到相应的位置，滑动页面，左边的列表颜色就会变化到相应的颜色,滚动条也会相应改变。 这个功能利用了jquery里的scroll事件。先讲点击列表，跳转到相应的位置。在html5之前，我们可以在每块的div中添加一个name，即锚点，然后html5之后，就移除了锚点的概念，因此，就可以利用id去实现，可以在每块的位置添加一个item，比如item1,item2,item3……
锚点设置距离顶部高度的方法
ke0971的博客
03-07 5632
锚点位置偏移 body,h2,p{ margin:0; padding:0; } h2,p{ width:500px; position:relative; } p{ height:400px; background:#CCC; z-index:2; } p.extra{ margin:0 0 500px; } h2{ margin:-200px 0 0; border-top:200px so
tsx anchor锚点的使用
最新发布
05-19
TSX（TypeScript + JSX）中的锚点（Anchor）可以用于在同一页面内定位到特定的位置。以下是使用锚点的步骤： 1. 在需要定位的位置添加一个具有唯一标识符的元素，例如： ```tsx <div id="myAnchor">This is my anchor</div> ``` 2. 在需要定位到锚点的位置添加一个锚点链接，例如： ```tsx <a href="#myAnchor">Go to my anchor</a> ``` 3. 点击链接即可跳转到锚点所在的位置。 注意，锚点的标识符要唯一，并且需要以“#”开头。如果需要在相同页面内定位到不同的位置，可以添加多个具有唯一标识符的元素，并在对应的锚点链接中引用相应的标识符。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值