一、背景

给图标（按钮、标签）做事件点击时，常常会因为元素面积太小导致用户很难点中，影响用户体验，产品大佬就会让我们做大点击区域，一般给元素加个padding:6rpx就可以了，但这时UI就会偏差。

二、无入侵扩大热区的方法

给需要增加热区的元素加上add\_touch类，即可在原来的基础上，增加1.5倍触控热区。

.add_touch {
  position: relative;
}

.add_touch::after {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  transform: scale(1.5);
}

三、效果

四、代码片段

https://developers.weixin.qq.com/s/ROoPyNme7dfK