svg中改变class调用的线条颜色

本文介绍了一种在SVG中通过使用class属性结合内联样式来动态改变元素颜色的方法。具体而言,文中展示了如何覆盖预定义的颜色设置,这对于需要频繁更新颜色的应用场景非常有用。

<style type="text/css"><![CDATA[

.kV220 {stroke:rgb(255,0,0);fill:none}

.kV22 {stroke:rgb(0,255,255);fill:none}

.kV110 {stroke:rgb(255,255,0);fill:none}

]]></style>

<g id="617">

<use x="0" y="0" width="28.0" height="36.5" xlink:href="#Disconnector:普通刀闸_0" id="GHB.220.6022_I" commid="GuiH_S.220.6022_I" class="kV22" style="stroke:red"/>

</g>

---------------------------------------------------------------------------------

用use,使用class,class="kV22",这是要改变kV22中写的颜色:stroke:rgb(0,255,255);

正确方法是在use中补写属性:style="stroke:red",即:

<use ... commid="GuiH_S.220.6022_I" class="kV22" style="stroke:red"/>

用别的写法都不行,包括:stroke="red"

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值