css3的pointer-events属性你知道吗?-技术鸭论坛-前端交流-技术鸭(jishuya.cn)

css3的pointer-events属性你知道吗?

pointer-events: none; 可以让某个元素实现类似于海市蜃楼的效果,具体理解为,你可以看的到某个元素,但是你无法摸的着。

运用场景:

  • 比如需要用盒子做一个图(或者是echarts之类的图形,我们只看的),但是图形是压在某一个需要给点击事件的盒子上面
  • 然后图把需要给点击事件的盒子挡住了.
  • 解决方案就可以给这个图的css设置为pointer-events: none;
属性值 描述
auto 默认值。元素对指针事件做出反应,比如 :hover 和 click。
none 元素不对指针事件做出反应。
initial 将此属性设置为其默认值。参阅 initial
inherit 从其父元素继承此属性。参阅 inherit

你现在也可以随便打开一个网页找到一个按钮,然后给他设置这个属性,你就能体会到了

 

请登录后发表评论

    请登录后查看回复内容