一.问题: a 标签未能完全包裹 img
原因: a 标签为行内元素 inline ,不能包含内容
解决:将 a 标签的 display 设置为 inline-block 或 block
二.问题: a 标签嵌套 img , a 超出 img 内容(或有多余空白)
原因: img 在 a 中垂直对齐方式为 vertical-align 默认值为 baseline ,所以 img 垂直对齐时是按照 a 的基线对齐而不是底线.
解决:img添加 vertical-align:bottom CSS属性即可
三:问题: a 标签嵌套 img 时,在微信公众号中点击图片是查看图片而不是跳转链接
原因: 未知具体原因(个人猜测是img层级比a标签高所导致)
解决:在img中添加 pointer-events: none CSS属性 阻止img打开图片,此时点击的就是a标签