SVG img keepAspectRatio Chrome

2024-05-21

当我对 SVG 文件中的图像使用preserveAspectRatio=none 时,它​​似乎在 Google Chrome 中不起作用。 SVG 不会根据图像宽度和高度进行缩放。

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg  id="test" 
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="0 0 1024 768"> 
<defs>
</defs>
<image x="288" y="140" width="368" height="160" xlink:href="image.svg" preserveAspectRatio="none" />
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg  id="test" 
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="0 0 1024 768"> 
<defs>
</defs>
<image x="288" y="140" width="368" height="160" xlink:href="image.svg" preserveAspectRatio="none" />
</svg>

在 IE9、最新的 Opera 和 FF 中都可以使用!

如果应该包含的图像没有属性preserveAspectRatio=none,它似乎不起作用。 我不能假设每个 SVG 都有这个属性。所以我需要知道如何覆盖这样的属性,以防 SVG 嵌入“图像”标签。


http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute
请尝试“推迟”。
但我认为chrome不支持这个值。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

SVG img keepAspectRatio Chrome 的相关文章

  • 单击按钮时,如何将数字存储在 html 表单输入中作为 javascript 变量? [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 基本上我想做的是 当用户在 HTML 表单输入字段中输入一个数字 然后按下提交按钮时 该数字将存储在 JavaScript 变量中
  • 背景 CSS 图像仅在 IE7 中不显示

    html 是 div class choose os p a href someLink class windows Microsoft Windows a a href someOtherLink class macos Apple Ma
  • 为什么我在 div 上看不到我的背景

    我有一个容器 并且在它的子 div 内有 float left 问题是 一旦我在子 div 上应用 float left 我的父 div 的背景就完全丢失了 div style background CCC width 100 div Th
  • JavaScript 表单提交 - 确认或取消提交对话框

    对于带有询问字段是否填写正确的警报的简单表单 我需要一个执行此操作的函数 单击按钮时显示警告框 有两个选项 如果单击 确定 则提交表单 如果单击 取消 警报框将关闭 并且可以调整并重新提交表单 我认为 JavaScript 确认可以工作 但
  • document.querySelectorAll("input[type=checkbox") 的结果数组的顺序是否有保证?

    我在页面正文中有以下 HTML 这些是此 HTML 页面上类型复选框的唯一输入 fieldset legend North Face legend N A1 fieldset
  • SVG 元素出现在 DOM 中但在屏幕上不可见

    我尝试使用 SVG 绘制五线谱Vexflow http www vexflow com and 拉斐尔 js http raphaeljs com当我加载页面时 SVG 元素出现在 DOM 中 但它们不会出现在屏幕上 我检查了是否有任何 C
  • jQuery 数据与 Attr?

    两者的用法有什么区别 data and attr使用时data someAttribute 我的理解是 data存储在 jQuery 中 cache 而不是 DOM 因此 如果我想使用 cache对于数据存储 我应该使用 data 如果我想
  • 使用 Objective-C 将 HTML 文本转换为纯文本

    我有巨大的NSString里面有 HTML 文本 该字符串的长度超过 3 500 000 个字符 我怎样才能将此 HTML 文本转换为NSString里面有纯文本 我正在使用扫描仪 但它运行速度太慢 任何想法 这取决于您的目标 iOS 版本
  • graphviz 嵌入 url

    我试图弄清楚如何生成带有超链接的图表 您可以单击以访问图表中每个节点 边的更多详细信息 我发现 graphviz 使用 URL 节点属性具有这种能力 使用我的测试文件 graph G node label N graph bb 0 0 21
  • ASP.Net 控件的 InnerHTML 和 InnerText 属性之间的区别?

    例如 在使用 ASP NET 控件时 h1 text h1 如果我们想更改标题的文本 我们可以通过两个属性来完成InnerHTML and InnerText 我想知道这两个属性之间的基本区别是什么 InnerHtml让您直接输入 HTML
  • 如何将div内容添加到jspdf中的新页面?

    如何将div内容添加到jspdf中的新页面 我尝试使用 br 它创建了一个新页面 但我看不到内容 div div style margin 3px 430px First Page div div Place content to Seco
  • :hover 状态在 iOS 上不会结束

    我有一个带有悬停状态的简单菜单
  • 在 Javascript 中动态添加事件处理程序

    我在使用 Javascript 时遇到了一个奇怪的问题 我得到的是一个特定格式的字符串 我将尝试用它创建一个表 该表每行只有一个单元格 字符串的格式为 每个单元格 行 需要显示内容 将传递给的参数onmouseover当用户将鼠标移动到显示
  • 如何在 Java 中使用 HTML 解析器和 Apache Tika 来提取所有 HTML 标签?

    我下载了 tika core 和 tika parser 库 但找不到将 HTML 文档解析为字符串的示例代码 我必须删除网页源的所有 html 标签 我能做些什么 如何使用 Apache Tika 进行编码 您想要 html 文件的纯文本
  • Ajax JSON 数据和灯箱冲突

    我有一个带有灯箱插件的画廊设置光廊 http sachinchoolur github io lightGallery docs 该画廊与静态 HTML 完美配合 当我动态抓取 API 数据并尝试让灯箱处理这些项目时 问题就出现了 我似乎无
  • 自 JRE 1.7.0_25 起,Batik 无法进行转换

    自从我更新到 JAVA 1 7 0 25 以来 蜡染在应用转换时会抛出异常 堆栈跟踪是 java awt image ImagingOpException Unable to transform src image at java awt
  • 水平平滑滚动 100px

    Heyjo problem 一周以来我一直在寻找 javascript 或 jQuery 代码 以便在我的网站上实现滚动按钮 我失败的那一刻是按钮应该多次工作的时候 他的任务不是滚动到专用元素 而是应该向左滚动 例如 100px 此外 滚动
  • 删除

    好的 我有一个小菜单栏 菜单内的三个元素还有更多的子菜单 但是菜单栏中的元素之间有不必要的间距 而且我创建的子菜单有不必要的背景宽度 我在代码中将其涂成白色以使读者理解 由于这种不必要的宽度 即使鼠标悬停在不可见的宽度上 在本例中为白色 本
  • 为什么字体扩展仅适用于 PDF,而不适用于其他格式(HTML、XLS、DOC)?

    通过 Jaspersoft Studio 我们使用以下设置将用于 Web 应用程序的内置 Windows Calibri 字体变体导出到字体扩展 JAR 中 导出的jrfontextensions jar内的目录结构如下 jrfontext
  • 禁用 Chrome 扩展中的“检查弹出”菜单项

    我想禁用我正在开发的扩展中的 检查弹出窗口 菜单选项 我怎样才能做到这一点 我现在可以这样做 因为我安装了一些禁用此选项的扩展 例如 klip me 的 发送到 Kindle The 检查弹出窗口 http developer chrome

随机推荐