<!-- a标签进行嵌套的时候 -->
<a href="#outer">outerA
<a href="#inner">innerA</a>
</a> <!-- 而浏览器则会解析成 -- >
<a href="#outer">outerA</a>
<a href="#inner">innerA</a>

1.使用object标签进行嵌套

<a href="#outer">
outerA
<object><a href="#inner">innerA</a></object>
</a>

这样在内层a标签加一层object标签嵌套,可以解决了a标签嵌套的问题了。这个办法在火狐和谷歌、IE9及以上是没问题的。但是IE8及以下就会有问题,因为IE8不支持object标签,它会将object解析成一个对象a标签的内容显示不出来。所以就有了下面的第二种方案。

2.将外层a标签改为行内块级元素即display:inline-block;设置height/width并设置为绝对定位将其放在里层a标签的位置,通过调整里层a标签及外层a的z-index大小,使得鼠标能正确选中a标签;

这样通过改变外层a标签的display并调整position及z-index也可以达到a标签嵌套的效果,注意这里说的是效果而不是具体的解析就是嵌套的。

a标签嵌套a标签效果的两种解决方案的更多相关文章

  1. 转:前端页面a标签嵌套a标签效果的两种解决方案

      这是由工作中的一个小改动需求得到的这个解决方案的:那个需求是这样的,如图: 需求原来是球队名字没有点击功能的,而蓝色方框两队之间的比赛点击的时候会跳转到比赛文字直播页面.现在需要要求点击球队名字要 ...

  2. 前端页面a标签嵌套a标签效果的两种解决方案

    这是由工作中的一个小改动需求得到的这个解决方案的:那个需求是这样的,如图: 需求原来是球队名字没有点击功能的,而蓝色方框两队之间的比赛点击的时候会跳转到比赛文字直播页面.现在需要要求点击球队名字要跳转 ...

  3. IE浏览器下a标签嵌套img标签默认带有边框

    最近写在线主页时发现IE浏览器下a标签嵌套img标签默认带有边框: 解决办法:img{border:0 none;} 注意,严格意义上0和none都要加上!

  4. 网页内容的html标签补全和过滤的两种方法

    网页内容的html标签补全和过滤的两种方法: 假设你的网页内容的html标签显示不全,有些表格标签不完整而导致页面混乱,或者把你的内容之外的局部html页面给包括进去了,我们能够写个函数方法来补全ht ...

  5. a标签嵌套a标签在实际项目开发中遇到的坑

    大家都知道HTML的嵌套规范,其中一个规范是块元素嵌套行内元素,块元素嵌套块元素,行内元素嵌套行内元素,行内元素不能嵌套块元素. 其中需要注意的是行内元素嵌套行内元素,a标签虽然是行内元素,但是a标签 ...

  6. javascript文件夹选择框的两种解决方案

    javascript文件夹选择框的两种解决方案 解决方案1:调用windows 的shell,但会有安全问题. * browseFolder.js * 该文件定义了BrowseFolder()函数,它 ...

  7. PHP中实现MySQL嵌套事务的两种解决方案

    PHP中实现MySQL嵌套事务的两种解决方案 一.问题起源 在MySQL的官方文档中有明确的说明不支持嵌套事务: Transactions cannot be nested. This is a co ...

  8. Android 的保活的两种解决方案

    原文链接:http://blog.csdn.net/pan861190079/article/details/72773549 详细的阐述了 Android 的保活的两种解决方案 —— 由panhao ...

  9. 解决前端页面a标签嵌套a标签bug

    在前端页面中,一般二级导航栏会出现a嵌套a标签出现重复的父元素a标签bug 比如: <nav class="nav"> <ul> <li> &l ...

随机推荐

  1. Tournament

    题意: 有 $n$ 个 $K$ 维向量,若向量A只要有任意一维大于向量B,则认为A可能打败B,将n个向量一个一个加入,求问对于每次加完后的向量集合:有几个向量可能活到最后. 解法: 考虑如果A可以打败 ...

  2. 面试题: Spring 框架 Bean的生命周期

    [Java面试五]Spring总结以及在面试中的一些问题.   1.谈谈你对spring IOC和DI的理解,它们有什么区别? IoC Inverse of Control 反转控制的概念,就是将原本 ...

  3. 3、Linux下配置Java环境

    转载:http://blog.sina.com.cn/s/blog_c5a35e780102wtxl.html 生物信息很多软件都是用java写的,所以需要在linux上配置java运行环境.平台上的 ...

  4. 15、使用ggtree实现进化树的可视化和注释(转载)

    本文作者:余光创,目前就读于香港大学公共卫生系,开发过多个R/Bioconductor包,包括ChIPseeker, clusterProfiler, DOSE,ggtree,GOSemSim和Rea ...

  5. JAVA之J2EE学习路线

    摘自:http://blog.csdn.net/hsc456/article/details/51970559   历经2,3个月,终于学完了J2EE的方方面面,虽然还是一知半解,好歹也算是整条路都走 ...

  6. 图解Laravel的生命周期

    先来张图大致理解下laravel的生命周期. 下面对应相应的代码,解释上图. //文件路径:laravel/public/index.php /** * laravel的启动时间 */ define( ...

  7. es6基础系列三:解构赋值

    解构就是ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值(只能用于数组,对象或迭代器).如果解构不成功,则等于undefined,但不能赋值为undefined和null,因为undefi ...

  8. 阿里云 Ubuntu 服务器 安装 pymssql

    我是按照官方的说明文档: http://www.pymssql.org/en/stable/intro.html#getting-started 一步一步操作的,但是没有成功,在网上搜索了很多信息,最 ...

  9. ejs使用文档

    EJS是一个javascript模板库,用来从json数据中生成HTML字符串. 功能:缓存功能,能够缓存好的HTML模板: <% code %>用来执行javascript代码 ejs模 ...

  10. PAT 1087【二级最短路】

    二级最短路+二级最短路,就是DP过程吧. 代码稍微注释一些,毕竟贴代码不好.. #include<bits/stdc++.h> using namespace std; typedef l ...