html中的锚点
一、页面内跳转的锚点设置
页面内的跳转需要两步:
方法一:
①:设置一个锚点链接<a href="#miao">去找喵星人</a>;(注意:href属性的属性值最前面要加#)
②:在页面中需要的位置设置锚点<a name="miao"></a>;(注意:a标签中要写一个name属性,属性值要与①中的href的属性值一样,不加#)标签中按需填写必要的文字,一般不写内容
方法二:
①:同方法一的①
②:设置锚点的位置 <h3 id="miao">喵星人基地</h3>;在要跳转到的位置的标签中添加一个id属性,属性值与①中href的属性值一样,不加#
方法二不用单独添加一个a标签来专门设置锚点 ,只在需要的位置的标签中添加一个id即可。
小案例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <a name="miao"></a><!--设置锚点方法1--> |
二、跨页面跳转
①:设置锚点链接,在href中的路径后面追加:#+锚点名,即可
如:<a href="萌宠集结号.html#miao">跳转到萌宠集结号页面</a>
②:要跳转到的页面中要设置锚点,方法见一种的步骤②,两个方法任选其一。
html中的锚点的更多相关文章
- 讨论SEO中是锚文本有效,还是纯文本有效呢?
现在很多SEO好友不断在讨论,在SEO优化中,到底是锚文本有效,还是纯文本有效呢? 在这里给大家举一下列子:如“张家口人才网”这样的就叫做锚文本,意思是在原有的文本中加上超级链接,指向到优化的网页上面 ...
- html中设置锚点定位的几种常见方法(#号定位)
在html中设置锚点定位我知道的有几种方法,在此和大家分享一下: 1.使用id定位: <a href="#1F">锚点1</a> <div id=&q ...
- vue中的锚点和查询字符串
1.什么是锚点 锚点(achor):其实就是超链接的一种. 如:普通的超链接 <a href="sub_task_detail.php">详细</a> 主 ...
- angularjs中使用锚点,angular路由导致锚点失效的两种解决方案
壹 ❀ 引 公司新项目开发中,首页要做个楼层导航效果(如下图),要求能点击图标对应跳到楼层即可,因为不需要跳转过度动画,也要求最好别用JQ,想着原生js操作dom计算top的兼容性,想着用锚点实现算 ...
- html中的锚点设置
html中的锚点 一.页面内跳转的锚点设置 页面内的跳转需要两步: 方法一: ①:设置一个锚点链接去找喵星人:(注意:href属性的属性值最前面要加#) ②:在页面中需要的位置设置锚点<a na ...
- ui-router中的锚点问题(angular中的锚点问题)
angular.module('anchorScrollExample', []) .controller('ScrollController', ['$scope', '$location', '$ ...
- [原创作品]web网页中的锚点
因为近来在从事web前端开发的工作,所以写的文章也都是关于web这一块.以后将分享算法和web高级编程的内容,很多公司的web前端不够重视,以为是很low-level,给的待遇也很一般,其实,这都是很 ...
- yaml中的锚点和引用
项目引入yaml语言来写配置文件,最近发现利用其锚点&和引用*的功能,可以极大减少配置文件中的重复内容,将相同配置内容收敛到锚点处,修改时,只需要修改锚点处的内容,即可在所有引用处生效. ya ...
- Cocos2d-x 3.0final 终结者系列教程08-画图节点Node中的锚点和坐标系
图片问答,(仅仅要回答正确,锚点和坐标系就学会了) 1.下图一共同拥有几个填充为淡黄色的实心矩形? 选择:A,2个 B, 4个 C,1个 D,16个 答案.B.4个 2.下图的4个实心矩形排列在几行 ...
随机推荐
- Web开发安全小贴士
想要开发出一个安全的.健壮的Web应用其实是非常困难的, 如果你想要快速开发出一款集使用价值.用户体验度.以及安全性为一身的产品,以下安全步骤很必要!!! 数据库 1.对类似访问令牌.电子邮箱 ...
- 通过wireshark学习Traceroute命令(UDP,ICMP协议)
traceroute: 通过TTL限定的ICMP/UDP/TCP侦测包来发现从本地主机到远端目标主机之间的第三层转发路径.用来调试网络连接性和路由问题. mtr: traceroute的一个变种,能根 ...
- django使用model创建数据库表使用的字段
Django通过model层不可以创建数据库,但可以创建数据库表,以下是创建表的字段以及表字段的参数.一.字段1.models.AutoField 自增列= int(11) 如果没有的话,默认会生成一 ...
- CSS实现文字和图片的水平垂直居中
关于文字和图片的水平垂直居中,在前端界绝对算是一个老生常谈的问题了,尤其是垂直居中,什么千奇百怪的解法都能想的出来.下面我就总结一些比较常用的方法: 一.文本的水平垂直居中: 1.水平居中: 是不是很 ...
- JS学习笔记——JavaScript继承的6种方法(原型链、借用构造函数、组合、原型式、寄生式、寄生组合式)
JavaScript继承的6种方法 1,原型链继承 2,借用构造函数继承 3,组合继承(原型+借用构造) 4,原型式继承 5,寄生式继承 6,寄生组合式继承 1.原型链继承. <script t ...
- C++实现密码强度测试
最近在博客中看到许多用js写的密码强度检测,我觉得挺有意思的,所以呢我打算自己也写个来玩玩,最可悲的是我还没学js,当然这不重要,所以呢打算用C++来写一个密码强度检测,这里我来给大家说说用JS写的和 ...
- 支付宝即时到账DEMO配置与使用
支付宝网页即时到账功能,可让用户在线向开发者的支付宝账号支付资金,交易资金即时到账,帮助开发者快速回笼资金. 当用户进行支付操作时候可以直接跳转到支付宝支付页面进行支付 1. 准备 关于支付宝签约即时 ...
- udl文件测试数据库连接
直接建一个udl后缀的文件(新建txt文件,改后缀) 然后会默认有个小电脑标志,双击打开就可以看到,可以用来配置数据库连接信息,可以测试连接,如果连接通过,可以再用记事本打开这个udl文件,里面就有生 ...
- SICP-2.2-数据的抽象
数据的抽象 生活中有许多的事物具有复合结构,例如地理位置所用的经纬度,便是通过一个复合结构来代表位置,在我们的程序当中,我们设法将经度纬度组合成一对,我们既可以把他们当做一个整体单元来进行操作,而且也 ...
- fedora安装QQ
只看重利益的TC根本没想到要维护和更新linux版本的QQ,所幸fedora linux的中文社区 (https://repo.fdzh.org) 对大家比较照顾,还是针对fedora做了wine Q ...