点击穿透是指当页面上有多层元素时，如果我们点击某一层的元素，由于下一层元素的位置和大小与上一层元素重叠，会触发下一层元素的点击事件，这样就造成了所谓的点击穿透。这个问题在移动端经常会遇到。

在CSS中，我们可以使用以下的方式来解决点击穿透问题：

.top-layer {
position: absolute;
z-index: 1;
}
.bottom-layer {
position: relative;
z-index: 0;
}

在上面的代码中，我们通过属性z-index来指定每个元素的层级关系。z-index 是一个整数，通常指定在 0 到 2147483647 之间。层数小的元素在层数大的元素之下，所以通过将底层元素的 z-index 值设置为 0，顶层元素的 z-index 值设置为 较大的数，我们可以防止点击穿透的问题。

然而，有些情况下我们并不能直接修改 z-index。在类似弹出层或者下拉菜单等组件中，弹出的层级通常都是动态生成的，并将其附加到当前页面的指定节点下。此时，点击穿透依然会是一个问题。

CSS中提供了一种方便的解决方案：将点击事件的响应应用到容器上，而不是其中的元素。在容器上，我们添加一个全屏的透明层，对于容器中穿透的点击事件，透明层可以拦截下来，从而可以有效避免点击穿透的问题。

.wrapper {
position: relative;
}
.mask {
position: absolute;
width: 100%;
height: 100%;
background-color: transparent;
}

在上面的代码中，我们在容器(wrapper)中添加一个透明层(mask)，并将其覆盖在容器上方。透明层的 position 指定为 absolute，width 和 height 设置为 100%，这样透明层就覆盖了整个容器。

以上就是CSS中解决点击穿透问题的两种方式。第一种方式通过修改元素的 z-index 属性来防止点击穿透的问题，而第二种方式则通过添加透明层来拦截下穿透的点击事件。两种方式各有优缺点，具体使用时需要根据实际情况来选择。