html 锚点定位
在html中设置锚点定位我知道的有几种方法。在此和大家分享一下:
1、使用id定位:
<a href="#1F" name="1F">锚点1</a>
<div name="1F"> <p>
11111111111
</br>
11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>11111111111
</br>
</p>
</div>
这种定位能够针对不论什么标签来定位。
2、使用name定位:
<a href="#5F">锚点5</a>
</br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>
<a name="5F">1111111</href>
使用name属性仅仅能针对a标签来定位。而对div等其它标签就不能起到定位作用。
3、使用js定位
<li class="" onclick="javascript:document.getElementById('here').scrollIntoView()"></li>
html 锚点定位的更多相关文章
- html中设置锚点定位的几种常见方法(#号定位)
在html中设置锚点定位我知道的有几种方法,在此和大家分享一下: 1.使用id定位: <a href="#1F">锚点1</a> <div id=&q ...
- 【TRICK】解决锚点定位向下浮动Xpx问题
1. 问题描述 页面滚动后,菜单栏会固定在页头,当锚点定位时,菜单会遮盖部分定位后的内容,所以需要在锚点定位后自动向下漂移Xpx. 2. 解决办法 a. 利用空div 占位,如下: <a hre ...
- 当锚点定位遇上position: fixed
<!DOCTYPE html><html> <head> <title>当锚点定位遇上position: fixed</title> < ...
- Android tabLayout+recyclerView实现锚点定位
原文链接:https://mp.weixin.qq.com/s/L3o2i3WTmg1ScXEYDS8YCg 在上一篇文章 Android 实现锚点定位中,我们介绍了tablayout+scrollV ...
- Android 实现锚点定位
相信做前端的都做过页面锚点定位的功能,通过<a href="#head"> 去设置页面内锚点定位跳转. 本篇文章就使用tablayout.scrollview来实现an ...
- 锚点定位,jquery定位到页面指定位置
jquery锚点定位 $('body,html').animate({scrollTop: $('#ter1').offset().top}, 500);#ter1是你要定位的id对象,500是0.5 ...
- js实现锚点定位
js实现锚点定位的原理是,算出定位的标签距离顶部的高度,点击触发标签,重新赋值滚动条的高度到达指定位置. <!DOCTYPE html> <html> <head> ...
- html锚点定位不准确问题
问题描述 当顶部固定时,点击锚点,会跳转到锚点以下. <style> #one,#two,#three{ height: 500px; } #top{ position: fixed; h ...
- 微信小程序基于scroll-view实现锚点定位
代码地址如下:http://www.demodashi.com/demo/14009.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...
随机推荐
- python - break和continue
break 终止整个循环:当循环或判断执行到break语句时,即使判断条件为True或者序列尚未完全被历遍,都会跳出循环或判断 for i in xrange(10): print(i) if i = ...
- hdu 5020(斜率的表示+STL)
Revenge of Collinearity Time Limit: 8000/5000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/ ...
- hdu 3986(最短路变形好题)
Harry Potter and the Final Battle Time Limit: 5000/3000 MS (Java/Others) Memory Limit: 65536/6553 ...
- 如何在CentOS 7上安装Nginx
第一步 - 添加Nginx存储库要添加CentOS 7 EPEL仓库,请打开终端并使用以下命令: sudo yum install epel-release第二步 - 安装Nginx现在Nginx存储 ...
- org.apache.commons.io.Charsets
requiredCharsets:由Java平台支持字符集对象标准名称,构造一个sorted map. public void test() { Map<String, Charset> ...
- MySQL复制表结构和内容到另一张表(转)
MySQL不要看它小,一个开源的产物,要学习它的东西真的很多.而它的一切是SQL Server无法比拟的. 复制表结构及数据到新表 create table 新表 select * from 旧表 只 ...
- Linux基础学习3
鸟哥私房菜第十一章 read 用来读取键盘输入的变量,常被用在shell script的交互当中 [root@www ~]# read [-pt] variable 选项不参数: -p :后面可以 ...
- 深入浅出 Cocoa 之 Core Data(1)- 框架详解
深入浅出 Cocoa 之 Core Data(1)- 框架详解 罗朝辉(http://blog.csdn.net/kesalin) CC 许可,转载请注明出处 Core data 是 Cocoa 中处 ...
- 2016.10.19 intelliJ的基本操作
参考大部分来自:IntelliJ IDEA 13试用手记(附详细截图) 用eclipse实在用的有点心累了.所以准备转战intelliJ. 一.下载安装 官网地址:http://www.jetbr ...
- 转: 使用maven给spring项目打可直接运行的jar包(配置文件内置外置的打法)
from: http://www.cnblogs.com/hdwang/p/5418747.html