草庐IT

svg-edit

全部标签

html - 在 Firefox 中带有基本 href 的 SVG 掩码

SVG掩码在Chrome中运行良好,但在Firefox中运行良好。所以我找到了另一种解决方法。但是当我使用像这样的基本标签时,图片标签不工作。这是HTML代码。mask.masked{width:300px;height:300px;-webkit-mask-image:url("mask.png");-webkit-mask-size:cover;mask:url("#svgmask");background-image:url("masked.jpg");}即使我使用绝对链接,图像标签也不起作用。 最佳答案 遇到了同样的问题。好

html - 如何使用 % 统一缩放内联 SVG

我正在尝试在流动上下文中使用SVG元素,使用%单位来设置与容器成比例的大小。如果您像图像一样包含SVG设计,它就像图像一样工作:您可以使用CSS轻松按比例缩放它,如下所示:.img-svg{width:100%;height:auto;}但是如果你使用内联SVG,一切都会改变.........这行不通:.inline-svg{display:block;width:100%;height:auto;}如果这样做,它会将SVG的框扩展到100%,但其中的所有元素将保持相同大小。这是一个jsfiddle:http://jsfiddle.net/s_d_p/jA62R/执行此操作的正确方法是

html - 如何使用 % 统一缩放内联 SVG

我正在尝试在流动上下文中使用SVG元素,使用%单位来设置与容器成比例的大小。如果您像图像一样包含SVG设计,它就像图像一样工作:您可以使用CSS轻松按比例缩放它,如下所示:.img-svg{width:100%;height:auto;}但是如果你使用内联SVG,一切都会改变.........这行不通:.inline-svg{display:block;width:100%;height:auto;}如果这样做,它会将SVG的框扩展到100%,但其中的所有元素将保持相同大小。这是一个jsfiddle:http://jsfiddle.net/s_d_p/jA62R/执行此操作的正确方法是

javascript - 所有主流浏览器上的 SVG Amazon S3 CORS 问题

我已经正确设置了S3(我相信是这样!!),因为其他图像和网络字体可以从S3正确加载。但是,在我的HTML设计中,我有这个-不知何故,它并没有在所有浏览器上加载(我已经在Chrome和Firefox上测试过)。在chrome上它至少会给出一个错误,firefox会默默地忽略它。我刚刚找到一个类似的资源-https://github.com/jonathantneal/svg4everybody/issues/16.如何解决这个问题。 最佳答案 经过数天的研究,没有我们想象的SVG解决方案标签应与CORS配合使用。browserdeve

javascript - 所有主流浏览器上的 SVG Amazon S3 CORS 问题

我已经正确设置了S3(我相信是这样!!),因为其他图像和网络字体可以从S3正确加载。但是,在我的HTML设计中,我有这个-不知何故,它并没有在所有浏览器上加载(我已经在Chrome和Firefox上测试过)。在chrome上它至少会给出一个错误,firefox会默默地忽略它。我刚刚找到一个类似的资源-https://github.com/jonathantneal/svg4everybody/issues/16.如何解决这个问题。 最佳答案 经过数天的研究,没有我们想象的SVG解决方案标签应与CORS配合使用。browserdeve

html - 选项元素内的 SVG

我正在创建以下svg元素和结构:产生一排小方block。就像这样:到目前为止一切正常。然后我将上面的代码放在select下拉列表的option中,如下所示:现在option的内容显示为白色空白,如下图所示:可以看到,图片的内容是空的。但是,如果我运行调试检查器,我仍然可以在那里检测到svg元素。我做错了什么?如何在选项中显示svg?谢谢。 最佳答案 HTML元素只能包含纯文本。您遇到的是长时间运行的“如何设置元素的样式”讨论。描述多年来提出的所有可能的黑客攻击和解决方案远远超出了这里的答案范围,并且纯粹是基于意见的。环顾四周试图覆盖

html - 选项元素内的 SVG

我正在创建以下svg元素和结构:产生一排小方block。就像这样:到目前为止一切正常。然后我将上面的代码放在select下拉列表的option中,如下所示:现在option的内容显示为白色空白,如下图所示:可以看到,图片的内容是空的。但是,如果我运行调试检查器,我仍然可以在那里检测到svg元素。我做错了什么?如何在选项中显示svg?谢谢。 最佳答案 HTML元素只能包含纯文本。您遇到的是长时间运行的“如何设置元素的样式”讨论。描述多年来提出的所有可能的黑客攻击和解决方案远远超出了这里的答案范围,并且纯粹是基于意见的。环顾四周试图覆盖

javascript - 具有相同 ID 的多个 svg

我可以在一个html页面中放置多个svg并在所有页面中使用相同的ID吗?........................ 最佳答案 由于规范将id属性定义为每个文档都是唯一的,因此您应该重构ID或使用替代方法,例如通过img或object标签嵌入。 关于javascript-具有相同ID的多个svg,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questions/37000385/

javascript - 具有相同 ID 的多个 svg

我可以在一个html页面中放置多个svg并在所有页面中使用相同的ID吗?........................ 最佳答案 由于规范将id属性定义为每个文档都是唯一的,因此您应该重构ID或使用替代方法,例如通过img或object标签嵌入。 关于javascript-具有相同ID的多个svg,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questions/37000385/

javascript - SVG - 使用 Javascript 添加一行

这个问题在这里已经有了答案:addanewlineinsvg,bugcannotseetheline(3个答案)关闭6年前。我写了一个简单的代码,当我点击一个按钮时在我的svg页面中添加一行这是htmlAppendtext和脚本$(document).ready(function(){$("#btn1").click(function(){$("svg").append('');console.log("done!");});});和jsfiddlehttps://jsfiddle.net/dch7xyez/1/该行已附加但不可见。谁能给我解释一下为什么?