SVG在< img>之间的显示差异和< object> [英] SVG display difference between <img> and <object>

问题描述

在<img>或<object>标签中显示SVG图像有什么区别?我在Android 3.1的<img>标记中使用SVG图像时遇到一些问题:

What's the difference between displaying a SVG image in an <img> or <object> tag? I was facing some problems using SVG images in a <img> tag on Android 3.1:

上方示例中的形状是<img>标签，而下方示例中的形状是完全相同的图像，但显示在<object>中. 为什么以不同的方式显示?并且<object>是否像<img>一样被缓存?

The shape in the upper example is an <img> tag and the lowest example is the exact same image but display in an <object>. Why is this displayed a different way? And is an <object> cached like an <img>?

你们有什么建议?

推荐答案

SVG为用作图片(html <img> SVG <image>或CSS背景图片)

Differences when SVG is used as an image (html <img> SVG <image> or CSS background images)

• 没有脚本
• 没有互动性
• 没有外部依赖性(在单个文件中完成)
• 没有DOM(即没有脚本从外部访问它们)
• 可以通过drawImage复制到画布中

我怀疑您没有外部依赖规则.您可能还需要检查SVG数据在根元素上是否具有prepareAspectRatio属性，以及是否确实该属性的值不为空.

I suspect you're suffering from the no external dependencies rule. You may also want to check that the SVG data has a preserveAspectRatio attribute on the root element and if it does that the value of that attribute is not none.

这篇关于SVG在< img>之间的显示差异和< object>的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！