下面整理出几种简便方式实现 click
伪元素时进行事件处理,附上例子代码。
HTML结构
首先 HTML 结构是这样的
<section>
<span>按钮文字</span>
</section>
实现方法
第一种
通过
CSS3
的
pointer-events
特性来实现。
CSS 代码
专门建立的学习Q-q-u-n: 731771211,分享学习方法和需要注意的小细节,不停更新最新的教程和学习技巧
(从零基础开始到前端项目实战教程,学习工具,全栈开发学习路线以及规划)
<style>
*{margin: 0; padding:0;}
section{
border: 1px solid #abc;
border-radius: 5px;
background-color: #def;
font-family: Microsoft YaHei;
height: 40px;
box-sizing: border-box;
cursor: pointer;
font-size: 16px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
pointer-events: none; /* 关键点在这里&