草庐IT

mermaid-svg-Rc

全部标签

css - 我可以在一个文件中包含多个 SVG 图像吗?

而不是执行以下操作:我宁愿做这样的事svg文件可能看起来像这样似乎SVG只是XML,我应该能够将所有图像存储在一个文件中,该文件一次性下载并在整个站点中使用。 最佳答案 在html文档中只能有一个根节点。然而,有多种方法可以实现您想要的。一种方式是SVGStacks它的工作原理是将所有绘图放在彼此之上,然后使用CSS仅显示您想要查看的那个。另一种方法可能是在不同的地方有一个像这样的shapes.svg然后使用svgView只显示您想要的位。所有这些确实意味着您在UA中使用了更多内存,因为整个svg文件被加载了3次,而您每次只看到它的

html - SVG变换的应用顺序

在W3C'sspec,它说:Thevalueofthe‘transform’attributeisa,whichisdefinedasalistoftransformdefinitions,whichareappliedintheorderprovided....Ifalistoftransformsisprovided,thentheneteffectisasifeachtransformhadbeenspecifiedseparatelyintheorderprovided当我在firefox、chrome和IE10中尝试follow标记时,所有这三个标记都是通过先进行平移,然后再

jquery - Html5 拖放 svg 元素

我正在尝试遵循html5拖放教程here.我无法在rect元素上注册dragstart事件。如果我将事件从draggable更改为mousedown,它会调用handleDragStart处理程序。请忽略代码中额外的空白注册。JSFiddleheresvgrect{cursor:move;}SVG/HTML5Exampleloc.js$(document).ready(function(){functionhandleDragStart(e){log("handleDragStart");this.style.opacity='0.4';//this==>e.targetistheso

HTML5 SVG - 文本定位

我正在尝试定位HTML5SVG中的元素,方法是给它一个上边距。比方说,我想要元素的上边距为10px。这是行不通的:Thequickbrownfoxjumpsoverthelazydog问题是,对于SVG文本元素,y距离是从文本的底部而不是顶部测量的。此代码生成的文本只有下方10像素可见。所以,我们必须添加font-sizey的值获得正确利润率的值(value):Thequickbrownfoxjumpsoverthelazydog至少,我是这么想的。但这也不起作用。现在,上边距太大了,正如您在fiddle中看到的那样:http://jsfiddle.net/yy8gS/2/.我希望上边

html - 如何在输入中添加 SVG 图标?

我需要在用于创建新用户的输入中放置图标。对于熟悉前端代码的人来说,这可能是一项非常容易的任务。但是我没有。这是线框图,然后我展示我的代码。线框如您所见。输入的左侧有图标。现在我的目录中有SVG并准备就绪,我只需要知道如何将它们放在输入中。这是表单的代码表格所以我有一个带有字符串的占位符,它当前只打印该字符串。我需要把图标放在我认为的里面吗?这是我为图标准备的CSS。CSS.icon-email{background-image:image-url('email-field.svg');}.icon-name{background-image:image-url('name-field.

html - Twitter bootstrap 3 RC2 - 在 IE8 中导航不工作

我正在使用TwitterBootstrap3RC2在我的页面顶部创建一个导航栏,它在IE8中工作正常。在IE8中,浏览器好像变小了,因此菜单会折叠以供移动设备查看。但事实并非如此。现在我知道TB3仍在进行中。但我想知道这里是否有人对此有解决方案。如果你想检查我的IE8问题,请看这里:http://jsfiddle.net/DnwJN/embedded/result/(您需要直接链接,因为它本身的JSFiddle不适用于IE8)这是JSFiddle:http://jsfiddle.net/DnwJN/您会发现导航栏在所有其他浏览器中都可以正常工作。甚至IE9。但不是IE8。而且TB3确实

html - 为什么我的 svg 上有一个 100% 的垂直滚动条?

谁能解释为什么我在Chrome和IE9中看到带有以下标记的垂直滚动条:FullscreenSVGhtml,body{margin:0px;padding:0px;width:100%;height:100%;}.fullscreen{width:100%;height:100%;}如果我将svg替换为div,它会完美运行。但是如果我把svg放在那个div里面,布局又被破坏了:将文档类型更改为XHTML似乎可以解决问题:但是内联SVG是HTML5的一部分,所以...与此同时,我还提交了bugreport. 最佳答案 我来晚了一点,但是

html - 内联 SVG - 通常用于 < img > SEO 的 "alt"标签的最佳替代品?

这个问题在这里已经有了答案:Accessibility:recommendedalt-textconventionforSVGandMathML?(7个答案)关闭6年前。假设我要换出一个在我的主站点标题中改为使用SVG。通常我会依赖的alt标签。是SVG这种类型转换的“alt”的最佳替代方法是什么?[titlehere][longdescriptionhere]...

javascript - 将文档内 SVG 栅格化为 Canvas

为了回答thisquestion正确地说,我认为我会:将文档内SVG文件转换为数据URL将其加载到中画出到转换到PNG数据URL将该数据URL加载到图像中。我在这里有一个这种尝试的例子:http://phrogz.net/SVG/svg_to_png.xhtml在Firefox中我得到(NS_ERROR_NOT_AVAILABLE)[nsIDOMCanvasRenderingContext2D.drawImage]在第3步尝试将图像绘制到Canvas时。为什么我在Firefox中会收到此错误,或者我该如何解决?在Chrome中我得到一个SECURITY_ERR当我尝试调用toDataU

html5 - 将整个网页设计为SVG文件

免责声明我意识到,考虑到标题的荒谬性,这听起来像一个巨魔。然而,这是一个真正的问题。我的背景涉及OpenGL/x86程序集。我最近开始学习网络编程。我真的很喜欢SVG+CSS,我想知道人们为什么不用SVG设计整个网页?上下文SVG提供了漂亮的原语:二次曲线+三次贝塞尔曲线;直线+填充——全部作为矢量图形SVG提供文本SVG提供仿射变换问题有人把整个网站设计成一个巨大的SVG文件的例子吗?如果没有,有什么限制?当使用SVG原语而不是DIV/表时,是否会遇到性能问题? 最佳答案 这是可能的;例如,您可以在SVG文档中嵌入HTML片段,以