CSS pointer-events 让鼠标穿透上层元素点击到下层的元素

☀️ 需求

红色矩形在上层，蓝色矩形在下层，鼠标点击的时候点的是红色矩形。如果才能点击到蓝色矩形呢?

💥 方案

使用css中pointer-events 可以穿透红色框点击到蓝色框。

在红色框添加样式

.red{
  pointer-events: none;
}

✨ 效果图