<!-- 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. MinimumTours TopCoder - 7620

    Problem Statement      Little Bonnie has taken a vacation to Ha Long Bay. There are a few thousand s ...

  2. 1.3 xss原理分析与剖析(4)

    0×01 URL编码 URL只允许用US-ASCII字符集中可打印的字符(0×20—0x7x),其中某些字符在HTTP协议里有特殊的意义,所以有些也不能使用.这里有个需要注意的,+加号代表URL编码的 ...

  3. kolla-ansible安装cinder

    LVM后端 环境拓扑 节点 IP 主机名 Controller/Network/Apollo 92.0.0.11 anode Compute/Storage 92.0.0.12 bnode multi ...

  4. OpenStack基础知识-打包知识点

    OpenStack是使用setuptools工具来进行打包,不过为了满足OpenStack项目的需求,引入了一个辅助工具pbr来配合setuptools完成打包工作. pbr (Python Buil ...

  5. 洛谷P1932 A+B A-B A*B A/B A%B Problem

    P1932 A+B A-B A*B A/B A%B Problem 题目背景 这个题目很新颖吧!!! 题目描述 求A.B的和差积商余! 由于数据有修改,减法运算结果可能带负号! 输入输出格式 输入格式 ...

  6. 字符串游戏(strgame)——博弈

    题目 [题目描述] pure 和 dirty 决定玩 $T$ 局游戏.对于每一局游戏,有 $n$ 个字符串,并且每一局游戏由 $K$ 轮组成.具体规则如下:在每一轮游戏中,最开始有一个空串,两者轮流向 ...

  7. 气泡提示 纯CSS

    tooltip(气泡提示) 依赖 脚本文件:CalvinTip.js 样式文件:toolTip.css 参数 elems HTMLNode 必须 气泡提示的元素 options Object 可选 多 ...

  8. Technical support website

    Technical support:Please leave a message if you have any questions or suggestions. email: swvrwafet@ ...

  9. chrome安装文件点击没有反应(收藏用)

    备份Chrome浏览器用户数据 关闭Chrome浏览器,用Windows资源管理器打开%LOCALAPPDATA%\Google,复制Chrome文件夹到其它目录.   打开程序和功能管理功能 按下W ...

  10. 学习:数学----gcd及扩展gcd

    gcd及扩展gcd可以用来求两个数的最大公因数,扩展gcd甚至可以用来求一次不定方程ax+by=c的解   辗转相除法与gcd 假设有两个数a与b,现在要求a与b的最大公因数,我们可以设 a=b*q+ ...