HTML实现图片在容器内自适应居中(SVG的image方案)

SVG 中的 image 元素和 HTML 下的 img 元素有些不同,后者设置 width/height 会对原图片进行非等比缩放,失去原来的图片比例。但是 SVG 中的 image 元素有些不同,设置 width/height 会对图片进行 等比缩放,并且图片会自适应前面设置好的宽高的容器。但如果想对 image 元素进行非等比缩放,可以通过设置 transform 实现。

阅读更多