在CSS和/或javascript中更改SVG颜色(使用object标签)不会执行任何操作

文章/答案/技术大牛

发布

1回答

javascript、html、css、svg

我知道如果你使用和img标签，你不能用css改变svg的颜色，而是应该让svg内联，但在我的例子中，我有多个大的svg，我想用javascript动态地改变颜色，所以让它们内联不是我最好的选择。然后我读到了关于使用对象标签的内容，因为它应该可以工作，但在我的例子中却不能。我已经读了一些其他的问题，但它们对我没有帮助。：How to access

浏览 73提问于2020-07-01得票数 1

回答已采纳

1回答

在跨内悬停时更改SVG颜色称为另一种样式

html、css、svg

你好，我想知道如何在span中选择SVG并在悬停时更改它的颜色。我的svg是从span内部的另一种样式调用的：我想做的是这样的事情：但它并不适用于SVG。在

浏览 0提问于2015-09-11得票数 0

回答已采纳

3回答

从外部源修改SVG

jquery、wordpress、svg

我试图以多种方式在wordpress中添加一个SVG，但它不能工作，可能是因为我复制里面的代码时的语法问题( 所以我需要从外部源()插入它，但我试图用CSS (每个路径都有它正确的ID)修改它(只改变填充颜色在jQuery中有没有办法做到这一点？有没有办法在DOM中修改它？

浏览 0提问于2013-12-05得票数 0

1回答

仅使用CSS为SVG上色？

html、css、svg

我经历了一次又一次，试图通过CSS直接给SVG着色，而不改变实际文件中的属性。我试图用一种新的颜色填充CSS中的SVG，但是我不能正常工作。在object元素中定位SVG元素似乎可以使用Google Chrome的Inspector中的CSS fill: red属性，但在代码中执行相同的操作并

浏览 2提问于2017-05-15得票数 0

7回答

如何在网页中使用.svg文件？

image、image-manipulation、svg、adobe-illustrator

我想知道如何在网页中实际使用.svg文件？

浏览 0提问于2010-01-06得票数 65

4回答

SVG对象从外部CSS更改颜色

html、css、svg

我正在尝试使用SVG(尝试用SVG替换图标字体)。我让它使用object标签来渲染image/svg。但是，我不能让它从CSS中改变颜色。假设我更喜欢从CSS给它着色，有没有一种方法可以在我使用嵌入SVG时做到这一点。<object class="partnerLogo" type="

浏览 3提问于2017-04-10得票数 10

6回答

如何在Angular中更改svg元素的颜色？

css、angular

我需要在我的Angular项目中通过应用不同的CSS类来加载、显示和动态更改SVG图像的颜色。这个问题没有帮助，因为它使用了现代程序库，我想避免它。我也不想复制d字段中的path标签直接放在Angular项目的html文件中，因为这将是一堵我不愿意接受的文字墙。相反，我可以接受使用外部专用库来实现正确的结果，比如 ng-inline-svg,我尝试通过以下方式使用它：无视以下<e

浏览 242提问于2019-12-12得票数 4

回答已采纳

1回答

其中一个功能是，你看到一个带有一双鞋子的页面，然后你可以选择“贴纸”放在鞋子上，以及这些贴纸的颜色。这些可以从鞋子旁边的面板中选择。我在想如何做到这一点的一种方法，我的想法是:显示一双鞋的图像，在图像上我放置两个小的img-tag (代表贴纸)，当用户点击一种贴纸时，我用该贴纸填充img-tag。当用户选择一种颜色时，我将img-tag中的图像替换为具有所选颜色的贴纸图像。那么，最好的方法是什么呢？

浏览 1提问于2017-03-23得票数 0

2回答

如何正确使用bypassSecurityTrustStyle

angular

我正在尝试使用一些简单的CSS和JavaScript的例子在一个角度。更改元素背景颜色的普通JavaScript方法如下所示：颜色是在JavaScript中随机创建的。Object] (see http://g.co/ng/secu

浏览 0提问于2017-03-27得票数 8

回答已采纳

1回答

CSS命名空间，HTML中的SVG :使用CSS突出显示SVG文件中的状态

javascript、css、svg、maps

如果我有一个三个颜色组的列表，红色，绿色，灰色，并且每个州都在这些组中，我应该如何收集我的CSS来根据这张地图着色呢？#CA {} 我知道我应该使用SVG标准的“填充”属性，而不是CSS属性“背景颜色”。下面是我在jsfiddle上使用CSS+javascript所做的其他努力。我在这里尝试了更多的东西，包括使用j

浏览 2提问于2013-08-14得票数 0

回答已采纳

2回答

使用css控制svg的大小和颜色

html、css、svg

这现在出现在一个网站的标题上，但我试图让css控制它的大小和颜色，这样我就可以对图标进行相应的大小调整，与网站上的文本颜色相匹配，并且当用户在图标上滚动时，我也会有某种滚动颜色的改变或亮/变黑。我不想使用内联svg，但我很乐意使用下面的img或对象技术。" height="20" alt="Search the site"/>

浏览 7提问于2017-12-13得票数 1

回答已采纳

4回答

使用<object>编辑填充

javascript、jquery、html、css、svg

我想替换一个flash对象，它使用单个swf文件(美国地图)，并使用html中标识的flash变量来动态更改不同状态的颜色。将单个文件用于多个页面。我已经创建了一个SVG文件，每个州的ID名称都是两个字母的州缩写。我想做的是使用或导入，然后在HTML页面上使用内联CSS操作SVG图像并调整某些项目的填充。SVG文件中的内联CSS

浏览 2提问于2012-08-01得票数 0

回答已采纳

2回答

了解SVG查询字符串参数

javascript、parameters、svg、query-string

我创建了一个SVG文件，打算在CSS中用作背景图像。我希望能够使用query-string参数更改SVG中的填充颜色，如下所示：#rect.red {color=red' ); } 据我所知，使用SVG中的脚本标记，我能够获得color参数并更新填充颜色</e

浏览 0提问于2013-04-13得票数 7

回答已采纳

2回答

使用CSS在悬停时转换SVG路径的填充属性

css、svg、hover、css-transitions

我在页面上的object标签中包含了一个SVG图像文件，如下所示： 有问题的图像是世界地图，我想在鼠标悬停在group

浏览 1提问于2013-11-16得票数 75

回答已采纳

1回答

SVG元素CSS更改在Chrome 35-36中不可见

jquery、css、google-chrome、svg、google-chrome-devtools

我有一个带有一堆SVG元素的应用程序。当我在SVG元素上悬停时，它们暂时改变颜色，如果我单击其中一个，它就会永久地改变颜色(或者直到再次单击它)。在Chrome中，GUI似乎被卡住了--鼠标悬停和单击操作有效，但颜色变化是不可见的--代码执行正确，但它似乎没有正确地呈现。当我检查Dev tools中的代码时，我看到元素具有"selected“类，并且元素具有颜色<

浏览 5提问于2014-06-04得票数 0

回答已采纳

13回答

如何使用外部CSS设置SVG的样式？

html、css、svg、stylesheet、external

我有几个SVG图形，我想通过我的外部样式表修改其颜色-而不是直接在每个SVG文件中修改。我不是将图形放在行内，而是将它们存储在我的图像文件夹中并指向它们。我以这种方式实现了它们，以允许工具提示工作，并且我还将它们包装在一个<a>标记中以允许一个链接。" viewBox="0 0 56.69 56.69"> <path d="M28.44......./> <

浏览 345提问于2013-08-26得票数 123

回答已采纳

22回答

如何更改svg元素的颜色？

css、svg

我想使用此技术并更改SVG颜色，但到目前为止我还不能这样做。我把它放在CSS中，但我的图像始终是黑色的，不管是什么。

浏览 614提问于2014-03-07得票数 718

回答已采纳

1回答

使用javascript(jquery)从外部SVG文件获取或设置css类值

javascript、jquery、css、svg

我有一个svg文件，其中包含以下格式的一些css类 <style type="text/css" id="style1"> <!文件使用以下标记显示在HTML文件中。<object id="testObject" type="image/svg+xml" data="img/test.svg

浏览 26提问于2019-03-03得票数 0

回答已采纳

2回答

在JavaScript执行之前执行removeChild <script>

javascript、onload、removechild

我有一个在iframe中显示的本地文件。我不能更改文件(或任何包含的文件- css、脚本等)。我需要从文件中删除所有标签。这很简单，但我想在执行它们内部的JavaScript之前删除它们。简单地执行以下操作： iframeHEAD.removeChild(iframeSCRIPT);将删除script标记，但<e

浏览 0提问于2010-09-14得票数 1

回答已采纳

1回答

使用AngularJS时，处理SVG文件的正确方式是什么？

angularjs、svg

在AngularJS应用程序中，处理SVG文件操作的正确方式是什么？我提到AngularJS的原因是我读到过混合使用jQuery和AngularJS不是一个好主意。我有一个可以加载的地图，可以执行以下操作： <object height="600" width="800" data="/images/map.svg" type=&q

浏览 1提问于2014-02-02得票数 0

点击加载更多