本文主要是介绍使用area标签实现标签的嵌套，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
在项目中我们会碰到这种需求：即点击这个整个a标签跳转到一个页面，点击a里面的某个a再跳转到另一个页面。有人会说，这还不简单，直接a标签嵌套a标签，可是事实如此吗，看代码：
<a href="#">clickOne<a href="#">clickTwo</a></a>
此时的节点结构是a嵌套这a，但是经过页面解析以后：
嵌套关系成了兄弟关系。这是因为a标签不能去嵌套a标签，所以浏览器会默认的把他们解析为兄弟节点的关系。
那怎么才能嵌套呢，这个时候我们的主角area标签就出场了
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>span {position: relative;}span area {position: absolute;left: 0;top: 0;width: 100%;height: 100%;}</style>
</head>
<body>
<a href="./../details/six.html">clickOne<span><area href="./../tabindex/index.html" alt="test">clickTwo</span>
</a>
</body>
</html>
area标签的href属性可以实现页面跳转，而且可以嵌套在任何元素里面（但是在最新版本的火狐浏览器里面不支持，仅支持谷歌浏览器）
这篇关于使用area标签实现标签的嵌套的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
