Tag: svg

如何访问JavaScript的SVG元素: 我搞乱了SVG，希望能在Illustrator中创buildSVG文件，并用Javascript访问元素。这里是Illustrator踢出的SVG文件（它似乎也添加了垃圾到我已经删除的文件的开始负载） <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="276.843px" height="233.242px" viewBox="0 0 276.843 233.242" enable-background="new 0 0 276.843 233.242" xml:space="preserve"> <path id="delta" fill="#231F20" d="M34.074,86.094L0,185.354l44.444,38.519l80.741-0.74l29.63-25.186l-26.667-37.037 c0,0-34.815-5.926-37.778-6.667s-13.333-28.889-13.333-28.889l7.407-18.519l31.111-2.963l5.926-21.481l-12.593-38.519l-43.704-5.185 L34.074,86.094z"/> <path id="cargo" fill="#DFB800" d="M68.148,32.761l43.704,4.445l14.815,42.963l-7.407,26.667l-33.333,2.963l-4.444,14.074 l54.074-1.481l22.222,36.296l25.926-3.704l25.926-54.074c0,0-19.259-47.408-21.481-47.408s-31.852-0.741-31.852-0.741 l-19.259-39.259L92.593,8.316L68.148,32.761z"/> <polygon id="beta" fill="#35FF1F" points="86.722,128.316 134.593,124.613 158.296,163.872 190.889,155.724 214.593,100.909 194.593,52.02 227.186,49.057 246.444,92.02 238.297,140.909 […]

作为背景图像时，修改SVG填充颜色: 将SVG输出直接与页面代码内联，我可以简单地用CSS修改填充颜色，如下所示： polygon.mystar { fill: blue; } circle.mycircle { fill: green; } 这很好，但是我正在寻找一种方法来修改SVG的“填充”属性，当它被用作一个BACKGROUND-IMAGE。 html { background-image: url(../img/bg.svg); } 我怎样才能改变颜色？这甚至有可能吗？作为参考，这里是我的外部SVG文件的内容： <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="320px" height="100px" viewBox="0 0 320 100" enable-background="new 0 0 320 100" xml:space="preserve"> <polygon class="mystar" fill="#3CB54A" points="134.973,14.204 143.295,31.066 161.903,33.77 148.438,46.896 151.617,65.43 134.973,56.679 118.329,65.43 121.507,46.896 108.042,33.77 126.65,31.066 "/> <circle class="mycircle" […]

透明文本剪出背景: 有什么办法让一个透明的文字切出一个背景效果，像下面的图片，使用CSS？因为图片replace文字而失去所有珍贵的search引擎优化服务将会很难过。我首先想到了阴影，但是我什么也找不出来… 图片是网站背景，绝对定位的<img>标签

PNG与GIF vs. JPEG与SVG – 何时最好使用？: 何时应该build立网站或接口等使用某些图像文件types？他们的优点和缺点是什么？我知道PNG和GIF是无损的，而JPEG是有损的。但是，PNG和GIF的主要区别是什么？为什么我应该比另一个更喜欢？什么是SVG，我应该什么时候使用它？如果你不关心每一个像素，你应该总是使用JPEG，因为它是“最轻”的？

用背景图像填充SVGpath元素: 是否可以为SVG <path>元素设置background-image ？例如，如果我设置元素class="wall" ，则CSS样式.wall {fill: red;}工作，但是.wall{background-image: url(wall.jpg)}不会，也不会.wall{background-image: url(wall.jpg)} .wall {background-color: red;} 。

jQuery的SVG，为什么我不能添加类？: 我正在使用jQuery SVG。我不能添加或删除一个类到一个对象。有人知道我的错误？ SVG： <rect class="jimmy" id="p5" x="200" y="200" width="100" height="100" /> 不会添加类的jQuery： $(".jimmy").click(function() { $(this).addClass("clicked"); }); 我知道SVG和jQuery一起工作正常，因为我可以定位对象，并在点击时发出警报： $(".jimmy").click(function() { alert('Handler for .click() called.'); });

透明的箭头/三angular形: 我想在图像上做一个透明的箭头。这个三angular形应该在一个块中缩进并显示背景图像。期望的输出： CSS： .barShow { background-color: #000; filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; } .barShow:before { top: 0%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-top-color: #999; border-width: 20px; margin-left: -20px; } 透明的CSS箭头应该是透明的，没有颜色。

如何使用CSS（jQuery SVG图像replace）更改SVG图像的颜色？: 这是我自己提出的一个方便的代码的自我问答。目前，embeddedSVG图像并不容易，然后通过CSS访问SVG元素。有很多使用JS SVG框架的方法，但是如果你正在做的只是一个带有翻转状态的简单图标，那么它们就太复杂了。所以这就是我想到的，我认为这是在网站上使用SVG文件的最简单的方法。它从早期的文本到图像replace方法的概念，但据我所知SVGs从来没有做过。这是一个问题：如何在不使用JS-SVG框架的情况下embeddedSVG并将其颜色更改为CSS？

jQuery的附加不工作与SVG元素？: 假设： <html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("svg").append('<circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red"/>'); }); </script> </head> <body> <svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 100" width="200px" height="100px"> </svg> </body> 为什么我什么都看不到