当前位置: 首页 > news >正文

解决伪类元素‘after‘或者‘before‘遮挡父元素,导致鼠标移入或点击等事件不生效的问题

第一种调整css的index值

如果对显示没有影响的话,可以这么做

第二种设置css属性:pointer-event:none

原理是:
对一个元素设置 pointer-events: none,能让浏览器在处理鼠标操作时,忽视掉这个元素的存在,直接「穿透」到点击区域背后的元素上。

意味着直接在这个元素上做鼠标操作时
该元素上的鼠标效果不会被处理,例如 hover 效果
该元素上的鼠标事件不会被响应,例如 click、mousein、mousedown 事件

可以参考文章:认识 CSS pointer-events 属性

备注:
伪元素不能添加事件,因为他们不是DOM元素,无法响应

http://www.lryc.cn/news/96703.html

相关文章:

  • 电动汽车市场的减速,正在让小鹏汽车付出代价
  • Yarn上Streaming流自动调节资源设计
  • 微信小程序的个人博客--【小程序花园】
  • 智慧园区楼宇合集 | 图扑数字孪生管控系统
  • 【代码随想录day21】二叉搜索树中的众数
  • 【防火墙】iptables防火墙(一)
  • 微信小程序之富文本特殊处理
  • react-draft-wysiwyg富文本编辑器
  • P5721 【深基4.例6】数字直角三角形
  • 【电子设计大赛】2023 年全国大学生电子设计竞赛 仪器和主要元器件清单
  • (八九)如何与InfluxDB交互InfluxDB HTTP API
  • excel 生成sql技巧
  • 2023牛客暑期多校训练营2(D/E/F/H/I/K)
  • Ubuntu搭建Samba服务-学习记录
  • Unity Shader - if 和 keyword 的指令比较
  • 【C++入门到精通】C++入门 —— 类和对象(了解类和对象)
  • DRS 迁移本地mysql 到华为云
  • 腾讯云 Cloud Studio 实战训练营——快速构建React完成点餐H5页面
  • 在 React 中,props(属性)用于在组件之间传递数据
  • Unity实现camera数据注入RMP推送或轻量级RTSP服务模块
  • CVPR2023新作:3D感知的AI换脸算法
  • Android安卓实战项目(4)---提供给阿尔兹海默症患者的APP(源码在文末)
  • 详解Mybatis之自动映射 自定义映射问题
  • shiro的优点
  • 使用分布式HTTP代理爬虫实现数据抓取与分析的案例研究
  • Linux操作系统运维常用集合
  • UE4/5C++多线程插件制作(十四、MTPAbandonable)
  • 集装箱装卸作业相关的知识-Part1
  • BurpSuite超详细安装教程-功能概述-配置-使用教程---(附下载链接)
  • 不同局域网下使用Python自带HTTP服务进行文件共享「端口映射」