2024年前端最新【前端点击穿透】pointer-events属性详解，华为采购面试经历

2401_84435555

于 2024-05-13 20:25:30 发布

阅读量383

点赞数 2

分类专栏：程序员文章标签：前端面试学习

本文链接：https://blog.csdn.net/2401_84435555/article/details/138818233

版权

程序员专栏收录该内容

166 篇文章 0 订阅

订阅专栏

总结

面试前要精心做好准备，简历上写的知识点和原理都需要准备好，项目上多想想难点和亮点，这是面试时能和别人不一样的地方。

还有就是表现出自己的谦虚好学，以及对于未来持续进阶的规划，企业招人更偏爱稳定的人。

万事开头难，但是程序员这一条路坚持几年后发展空间还是非常大的，一切重在坚持。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

前端面试题汇总

JavaScript

前端资料汇总

当这个属性设置为none时，元素则不接收hover、click事件，由他后面的元素进行接收。

/* Keyword values */
pointer-events: auto;
pointer-events: none;
pointer-events: visiblePainted; /* SVG only */
pointer-events: visibleFill;    /* SVG only */
pointer-events: visibleStroke;  /* SVG only */
pointer-events: visible;        /* SVG only */
pointer-events: painted;        /* SVG only */
pointer-events: fill;           /* SVG only */
pointer-events: stroke;         /* SVG only */
pointer-events: all;            /* SVG only */

/* Global values */
pointer-events: inherit;  从其父元素继承此属性
pointer-events: initial;  将此属性设置为其默认值

除去SVG的独有属性，其他是对浏览器来说生效的属性值。

做个demo

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>点击穿透demo</title>
  <style>
 .box1 {
 width: 100px;
 height: 100px;
 background: #04BBD4;
 margin: 20px;
 z-index: 3;
 }

 .box2 {
 width: 100px;
 height: 100px;
 background: #090A0E;
 margin: -80px 40px 20px;
 z-index: 2;
 /\* pointer-events: none; \*/
 }
 
 .box1:hover {
 background:#078404;
 }
 
 .box2:hover {
 background:#E98889;
 }
 </style>
</head>

<body>
    <div class="box1"></div>
    <div class="box2"></div>
</body>

</html>

算法刷题

大厂面试还是很注重算法题的，尤其是字节跳动，算法是问的比较多的，关于算法，推荐《LeetCode》和《算法的乐趣》，这两本我也有电子版，字节跳动、阿里、美团等大厂面试题（含答案+解析）、学习笔记、Xmind思维导图均可以分享给大家学习。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

写在最后

最后，对所以做Java的朋友提几点建议，也是我的个人心得：

疯狂编程
学习效果可视化
写博客
阅读优秀代码
心态调整

2401_84435555

关注

2
点赞
踩
9

收藏

觉得还不错? 一键收藏
0
评论
2024年前端最新【前端点击穿透】pointer-events属性详解，华为采购面试经历

面试前要精心做好准备，简历上写的知识点和原理都需要准备好，项目上多想想难点和亮点，这是面试时能和别人不一样的地方。还有就是表现出自己的谦虚好学，以及对于未来持续进阶的规划，企业招人更偏爱稳定的人。万事开头难，但是程序员这一条路坚持几年后发展空间还是非常大的，一切重在坚持。开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】前端面试题汇总JavaScript前端资料汇总当这个属性设置为none时，元素则不接收hover、click事件，由他后面的元素进行接收。
复制链接

扫一扫