前端如何制作不规则的形状并在这个区域中hover弹窗？

Question

图中的粉色块代表一个商店，hover上去会显示商店详细的弹窗。一开始想的是用图片，但图片是个矩形区域，hover的话空白区域也会触犯，然后就想用css去实现，像平行四边形都好解决skew,梯形用border透明实现hover透明区域会触发hover肯定不行，还有一些奇葩图形，真想不出好的解决方法？

Answer 1

解决了么   我也想问

Answer 2

svg，area

Answer 3

可以使用svg

Answer 4

svg 或者图像映射锚链 也就是<area>