大家都知道HTML的嵌套规范,其中一个规范是块元素嵌套行内元素,块元素嵌套块元素,行内元素嵌套行内元素,行内元素不能嵌套块元素。

其中需要注意的是行内元素嵌套行内元素a标签虽然是行内元素,但是a标签是不能嵌套a标签的,以前也没注意,结果不小心用了a标签嵌套a标签以后出现了以下的一个问题。

我想把二级显示变成三级显示,如下图

红色框部分是我增加三级显示的html代码

审查元素发现:我新增加的那个div(上图红色框的部分)莫名会增加一个a元素,这个增加的a元素是我新增加的div的父元素

这始终另我百思不得其解,后来和另外一个同事讨论测试以后发现是a标签嵌套a标签导致的。

解决方法:把下面红色框代码的父元素,也就是a标签,换成其它标签即可,比如div

注:P标签也是不能嵌套P标签的

至于为什么a标签不能嵌套a标签,网上的说法是:浏览器会自动添加结束符号,比如

你这样嵌套:<a href="www.baidu.com">谷歌<a href="www.weather.com.cn">中国天气网</a></a>

浏览器解析:<a href="www.baidu.com">谷歌</a><a href="www.weather.com.cn">中国天气网</a>

如果代码结构复杂,可能还会导致html层级错乱。

这里面还有一些平常可能不太清楚或者不知道的元素嵌套:http://blog.sina.com.cn/s/blog_12beb07f80102vfab.html

a标签嵌套a标签在实际项目开发中遇到的坑的更多相关文章

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

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

  2. 团队项目开发中,常见的版本控制有svn,git

    团队项目开发中,常见的版本控制有svn,git

  3. 项目开发中的一些注意事项以及技巧总结 基于Repository模式设计项目架构—你可以参考的项目架构设计 Asp.Net Core中使用RSA加密 EF Core中的多对多映射如何实现? asp.net core下的如何给网站做安全设置 获取服务端https证书 Js异常捕获

    项目开发中的一些注意事项以及技巧总结   1.jquery采用ajax向后端请求时,MVC框架并不能返回View的数据,也就是一般我们使用View().PartialView()等,只能返回json以 ...

  4. Angular 项目开发中父子组件传参

    在项目开发中经常会遇到 组件之间传参的问题.今天总结下在使用angular的项目中父子组件传参的问题: 1.父组件向子组件传参: 然后在父组件中 然后在父组件的html中 然后就可以在子组件中使用了 ...

  5. 《Maven在Java项目开发中的应用》论文笔记(十七)

    标题:Maven在Java项目开发中的应用 一.基本信息 时间:2019 来源:山西农业大学 关键词:Maven:Java Web:仓库:开发人员:极限编程; 二.研究内容 1.Maven 基本原理概 ...

  6. 炼金术(1): 识别项目开发中的ProtoType、Demo、MVP

    软件开发是很分裂的,只有不断使用原则和规律,才能带来质量. 只要不是玩具性质的项目,项目应该可以大概划分为0-1,1-10,10-100,100-1000四个种重要阶段.其中,0-1是原型验证性的:1 ...

  7. 项目开发中的git简单使用

    原文地址: https://www.zhuyilong.fun/tech/the-blog-git.html 示例远程仓库地址: https://github.com/zhu-longge/gitWo ...

  8. MyBatis 项目开发中是基于 XML 还是注解?

    只要你对 MyBatis 有所认识和了解,想必知道 MyBatis 有两种 SQL 语句映射模式,一种是基于注解,一种是基于XML. 基于 XML <mapper namespace=" ...

  9. Java项目开发中实现分页的三种方式一篇包会

    前言   Java项目开发中经常要用到分页功能,现在普遍使用SpringBoot进行快速开发,而数据层主要整合SpringDataJPA和MyBatis两种框架,这两种框架都提供了相应的分页工具,使用 ...

随机推荐

  1. 一个free异常引发的异常

    有同事反馈说自己的线程不工作,查看堆栈发现其打印如下: # # # # # # # # , info= # <signal handler called> # # # # # # # , ...

  2. MySQL数据库的基础学习

    1.什么是数据库 用来存储数据的仓库,简称数据库; 数据库可以在硬盘和内存中存储数据 数据库存储数据的本质: 通过文件来存储数据 2.数据库存储数据与文件存储的区别 (1).一个文件仅仅只能存储在一个 ...

  3. DRF的解析器和渲染器

    解析器 解析器的作用 解析器的作用就是服务端接收客户端传过来的数据,把数据解析成自己可以处理的数据.本质就是对请求体中的数据进行解析. 在了解解析器之前,我们要先知道Accept以及ContentTy ...

  4. fabric 持久化

    每个容器都有目录需要映射出来.在volume中添加如下映射即可: peer是: /var/hyperledger/peer{number}/org{number}:/var/hyperledger/p ...

  5. FortiGate抓包 Sniffer

    1.图形界面抓包 系统管理--网络--数据包捕获 选择添加好的数据捕获,点击"运行"开关抓包:抓取包后,可以点击"下载"将抓取的数据包保存的本地磁盘,可以用wi ...

  6. 156. Binary Tree Upside Down反转二叉树

    [抄题]: Given a binary tree where all the right nodes are either leaf nodes with a sibling (a left nod ...

  7. Partition by使用

    说到排序肯定第一个想到的就是order  by 说到分组第一个想到的这是 group  by ,partition by  使用的很少,少到快被忘记了,但是用的时候发现功能还是很强大的,有了它 很多复 ...

  8. python的基本用法(四)文件操作使用

    #读文件,文件必须存在才能读f=open('操作文件',encoding='utf-8')res =f.read()print(res)f.close()#写文件fw=open('操作文件',mode ...

  9. 3T - A1 = ?

    有如下方程:A i = (A i-1 + A i+1)/2 - C i (i = 1, 2, 3, .... n). 若给出A 0, A n+1, 和 C 1, C 2, .....C n. 请编程计 ...

  10. Sum of Even Numbers After Queries LT985

    We have an array A of integers, and an array queries of queries. For the i-th query val = queries[i] ...