使用 标签和 href 或 xlink:href 属性显示外部 SVG?

2023-11-21

从以下位置加载 SVG 时,无法正确显示<use>元素。我添加了一个<img>它后面的元素来说明预期的结果:

<svg>
  <use xlink:href="file.svg" href="file.svg"></use>
</svg>
<img src="file.svg" />

电流输出:

current output

工作小提琴: demo

感谢任何能指出我的错误的人。


  1. 你有这个错误:尝试从 URL https://...... 的框架加载 URL https:.....svg 是不安全的尝试域、协议和端口必须匹配

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

使用 标签和 href 或 xlink:href 属性显示外部 SVG? 的相关文章

  • Dimple.js - 将数据标签添加到条形图的每个条形

    我使用的是dimple js 它基于d3 js 是否可以向本示例中提到的条形图的每个条形添加数据标签http dimplejs org examples viewer html id bars vertical http dimplejs
  • 在 ipython 中使用 igraph 绘制顶点标签时出现问题

    我通常在 IPython 笔记本中工作 我使用以下命令在 Windows 上打开它 ipython qtconsole matplotlib inline 我目前正在使用 IPython QtConsole 3 0 0 Python 2 7
  • 由于内容不可压缩,谷歌浏览器中出现了新的复合层

    当 chrome profiler 说 图层是单独合成的 因为它无法被挤压 时 它到底意味着什么 我正在对我的 html 进行更改 并在相对 div 内引入了一个固定位置 div 并给出了will change transform在上面 完
  • 何时使用
    换行符 vs CSS 定位?

    我经常想知道如何正确使用 br 越线 似乎它们经常被错误地用于定位或清除应该使用 CSS 的内容 W3schoools org 说使用 br 适用于空白行 但不适用于创造或分离 http www w3schools com tags tag
  • 在这个页面中,悬停不起作用,我不知道为什么,而且页脚也没有占用 100% 宽度,即使我已经给了它

    我的编码是否不正确 或者悬停和页脚有什么问题 我需要知道 php 邮件程序是正确的还是我有错误 我无法找到错误 因为邮件功能在本地服务器上不起作用
  • 在引导程序中使用容器流体会导致水平滚动条

    这是一个简单的例子 div class container fluid div class row div class col lg 12 DUMMY CONTENT div div div Fiddle 演示 http jsfiddle
  • 通过 HTML5 文件和 URL API 正确创建和提供 PDF Blob

    好吧 假设我有文档数据存储在某处 让我们任意取this pdf http www grida no climate ipcc tar wg1 pdf tar 01 pdf 问题 1 我想要做的是对此 URL 进行 AJAX 调用 因为我需要
  • 100% 宽度减去边距和填充[重复]

    这个问题在这里已经有答案了 我一直在四处寻找 但找不到适用于我自己的问题的解决方案 我正在开发一个移动网站 需要输入框为屏幕的 100 宽度 但我有padding left 16px and margin 5px这使得盒子超出了屏幕 所以我
  • 检测 iframe 内容加载失败

    我可以使用以下命令检测 iframe 的内容何时加载load事件 不幸的是 就我的目的而言 这有两个问题 如果加载页面时出现错误 404 500 等 则永远不会触发加载事件 如果某些图像或其他依赖项加载失败 则会照常触发加载事件 有什么方法
  • php在html页面中创建额外空间

    我是网络开发新手 我真的被这个愚蠢的问题困扰了 当我在 html 代码之前插入 php 代码时 如下所示 它在我的页面顶部创建了额外的空白空间 并将整个内容 推下 是否有可能以某种方式避免创建额外的空间 如果 php 代码位于 html 的
  • JSDoc:如何在生成的文档中包含自定义 css 文件模板?

    JS文档docs https jsdoc app about configuring default template html say 将图像目录复制到输出目录 复制全部 将 myproject static 中的静态文件复制到输出目录
  • 如何使用表单上的提交按钮传递参数

    我想创建一个可以更改 PHP 制作的 mySQL 中的产品数据的程序 我有自动递增并指定每个产品的键列 当我单击编辑产品链接时 它将传递我从每个产品获得的键值 并链接到 editPage php Key data Key a href ed
  • 滚动时静态标题

    我编写了一个主页 现在我正在尝试构建一个标题 该标题是静态的 就像在滚动内容时不滚动一样 当内容位于其下方时 它应该保持在顶部 我找到了这个解决方案here https stackoverflow com questions 9677894
  • 如何使用 CSS 将 div 置于表格中心?

    我正在尝试向我的网站之一添加幻灯片 整个页面布局在一个 HTML 表格中 我非常讨厌它并且没有选择 我想将我的幻灯片放在该特定列的中心 我的 CSS 如下所示 slideshow position relative slideshow IM
  • NodeJS 无法加载 css 文件

    所以我正在尝试制作一个 NodeJS 服务器 并且我尝试保留尽可能少的附加组件 但是 我遇到了一个问题 我似乎无法加载任何内容CSS我调用的文件HTML文件 该调用似乎确实由服务器处理 但它不会显示在浏览器中 My 网络服务器 js fil
  • 转换 SVG 过滤器

    我正在尝试创建一个像 SVG 圆圈上的阴影这样的材质设计 我希望当您单击圆圈时 这个阴影能够以良好的过渡来增长 但目前我正在努力弄清楚是否可以为这种过渡设置动画 所以我希望有人能够提供帮助 我添加了一个到目前为止所得到的小例子 一个带有阴影
  • 如何将 HTML 表格转换为 csv 格式?

    是否有 HTML 解析器或某些库可以自动将 HTML 表格转换为 CSV 数据行 Here is http www unix com shell programming scripting 45274 html table csv html
  • 禁用任何类型的浏览器窗口滚动?

    有没有办法禁用滚动 不仅仅是滚动条 还有浏览器窗口的全部功能 根据您对 Keit 的回答 您不想在打开灯箱时滚动处于活动状态 如果是这种情况 您可以使用以下 css 在打开灯箱的同时向正文添加一个类 这个解决方案的好处是它保留了滚动 空间
  • 页面不会居中对齐

    我遇到了 CSS 问题 http www luukratief design nl dump parallax index html http www luukratief design nl dump parallax index htm
  • 有不同图像尺寸的缩略图 Bootstrap

    我想要包含不同大小和不同文本量的图像的缩略图 但我希望它们都具有相同的大小 像这样来自 Bootstrap 站点的示例 http getbootstrap com components thumbnails custom content 下

随机推荐

  • html5 画布中的运动 jpeg

    我正在尝试将运动 jpeg mjpeg 流 来自网络摄像头 包装到 html5 画布中 我知道 Safari 和 Chrome 对 mjpeg 具有本机支持 因此我可以将其放入img使其发挥作用 我想将它包裹在画布中的原因是我想对其进行一些
  • 设置对话框进度

    我有一个异步任务 在执行任务时不会添加百分比 它始终保持在 0 0 100 这是我的代码 private class getAppInfo extends AsyncTask
  • Django-filter 按相关字段过滤

    我有两张桌子 class Writer models Model name model CharField class Article models Model name model CharField writer model Forei
  • 如何在 AngularJS 页面中接收 POST 请求?

    我们制作了一个 AngularJS 应用程序 用户打开一个 URL xyz com booking 填写表格 然后选择一些要购买的商品 之后 用户单击 购买 按钮并离开该站点前往支付网关站点 付款成功后 支付网关通过在回调 URL xyz
  • 如何在Python中生成具有重复数字的随机列表

    所以几天前我才开始用Python编程 现在 我正在尝试制作一个生成随机列表的程序 然后选择重复元素 问题是 我的列表中没有重复的数字 这是我的代码 import random def generar listas numeros rango
  • 修改传递给脚本的参数 (Bash)

    我已经在谷歌上寻找了很长一段时间 但找不到任何符合我需要 想要做的事情 我的目标是编写一个带有两个参数的脚本 它将搜索第一个参数 这是一个列表 并检测第二个参数是否已在其中 例如 列表 bin foo bin random 随机 添加到列表
  • 无法理解带有两个变量的for循环[重复]

    这个问题在这里已经有答案了 当我在具有不同条件的 for 循环中使用两个变量时 我在下面使用了两个条件i lt 3 j lt 2for 循环始终执行 直到第二个条件失败 include
  • YARN 上 Spark 的性能问题

    我们正在尝试在纱线上运行我们的火花集群 我们遇到了一些性能问题 特别是与独立模式相比 我们有一个由 5 个节点组成的集群 每个节点都有 16GB RAM 和 8 个核心 我们在yarn site xml中将最小容器大小配置为3GB 最大容器
  • 按周/月间隔的日期范围分组

    我正在使用 MySQL 并且有下表 clicks int period date 我希望能够生成这样的报告 其中月经周期是在过去 4 周内完成的 period clicks 1 7 7 5 1000 25 6 31 7 18 6 24 6
  • 在 IOS 上使用 AFNetworking 流式传输 JSON

    使用 AFNetworking 从流式 JSON API 接收数据的最优雅的方式是什么 AFNetworking 为从 JSON API 接收非流数据提供了出色的支持 但我找不到任何流 JSON 的示例 AFNetworking 没有内置的
  • Safari 无法在 Rails 应用程序中加载 HTML5 视频

    我有一个 Rails 应用程序 我正在尝试使用以下标记播放 HTML5 视频 不起作用
  • PHP SoapClient - 具有相同键的多个属性

    我正在使用 SoapClient 尝试为该规范生成一些东西
  • 是否可以访问位于另一个项目中的 MVC 视图?

    我想将我的 MVC 项目分成几个项目 首先 我创建了两个项目Front and Views The Front项目是一个包含控制器和模型的 Web 应用程序 The Views项目是一个类库项目 仅包含视图 我的问题是如何让控制器调用位于V
  • jks 或 pkcs12:我应该使用哪一个来签署 Google Play 商店的 apk?

    Android Studio 3 5 3 在创建新的密钥存储后 建议我使用以下命令对其进行转换 keytool importkeystore srckeystore path myKeyStore jks destkeystore path
  • 在 Java 中的 AWS Lambda 上解析 multipart/form-data Body

    我是 AWS Lambda 新手 我正在尝试实现一个 Lambda 函数 该函数接收包含编码为 multipart form data 的数据的 POST 请求 该消息是使用 Lambda 代理集成通过 API 网关接收的 并且正文在到达
  • 使用OSGi实现自动更新

    我想做的是为我的代码创建一个 启动器 框架 给定 URL 和预定义的版本控制方案 1 检查是否有更新 2 下载更新 3 安装 更新 4 重新运行 应用程序 我想要 a 在现有 JVM 内完成所有这些工作 b 独立于平台 要求很高吧 根据我对
  • Babel 和 Webpack 抛出“无法解析‘regenerator-runtime/runtime’”

    我正在开发一个基于浏览器的项目 需要兼容 IE11 叹气 Webpack 令人窒息async await 这是我的控制台的输出 Based on your code and targets added regenerator runtime
  • Kafka Connect 启动失败

    我在新的linux centos 7上安装了kafka confluence oss 4 0 但kafka连接无法启动 重现步骤 Install Oracle JDK 8 Copy confluent 4 0 0 folder on opt
  • PyCharm 缺少项目类型下拉列表

    我刚刚下载了适用于我的 Mac 的 PyCharm 社区版 它似乎工作得很好 但由于某种原因 创建项目 对话框中缺少项目类型 下拉菜单 我是 PyCharm 以及 Python 的新手 所以我不知道这是否有一些明显的原因 然而 我能够创建项
  • 使用 标签和 href 或 xlink:href 属性显示外部 SVG?

    从以下位置加载 SVG 时 无法正确显示