a标签点击无响应

最新推荐文章于 2023-06-08 14:07:27 发布

vxstar

最新推荐文章于 2023-06-08 14:07:27 发布

阅读量706

点赞数

分类专栏： web前端文章标签： html css html5 css3

本文链接：https://blog.csdn.net/vxstar/article/details/114872528

版权

web前端专栏收录该内容

11 篇文章 0 订阅

订阅专栏

我的问题是几个position样式属性为absolute的a标签，脱离文档流，相互覆盖。文档流覆盖导致被覆盖文档的a标签无法触发

1、如下代码

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
	div{
		display: inline-block;
		width: 200px;
		height: 200px;
		position: absolute;
		border: #000000 2px solid;
	}
</style>
</head>
<body>
	<div>
		<a style="position: relative; left: 0px;" href="www.baidu.com">11</a>
		<br />
		<button onclick="alert('11')">11</button>
	</div>
	<div>
		<a style="position: relative; left: 40px;" href="www.baidu.com">22</a>
		<br />
		<button style="position: relative; left: 80px;" onclick="alert('22')">22</button>
	</div>
	<div>
		<a style="position: relative; left: 80px;" href="www.baidu.com">33</a>
		<br />
		<button style="position: relative; left: 160px;"  onclick="alert('33')">33</button>
	</div>
</body>
</html>

运行后