css - 如何删除 xlink 默认样式

Question

所以我决定在我正在处理的网站中使用一些 SVG。它们不是内联 HTML；相反，我使用对象标签链接到它们。我将它们用作链接，并且选择了使用 xlink 方法的路线。我正在用 CSS 设计它们的样式，除了一件事外，它工作正常。 :visited 状态似乎有自己的默认样式，而 :visited 选择器在 CSS 中没有响应，所以我很难摆脱这种默认样式。有任何想法吗？

XML:

<?xml version="1.0" standalone="no"?>
<?xml-stylesheet type="text/css" href="svg-style.css"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg id="svg" width="100%" height="100%" viewBox="0 0 100 125" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.41421;">
<a xlink:href="../../paving.html" target="_top">
<g id="Layer1">
    <g>
        <circle id="circle" cx="50" cy="50" r="45" style="stroke-width:3px;"/>
        <path d="M7.556,51.525l-1.372,-0.045l-0.942,-1l0.045,-1.372l1,-0.941l43.961,-14.695l-42.692,18.053Z"/>
        <path d="M92.992,51.097l-17.584,-7.309l-24.784,-10.288l0.003,-0.013l-0.379,-0.003l0,-0.012l0.381,-0.012l0.002,-0.005l0.004,-0.005l0.004,-0.004l25.512,8.336l18.104,5.906l0.523,0.763l-0.151,1.313l-0.741,1.095l-0.894,0.238Z"/>
        <path d="M48.277,62.5c0,0 0.646,-11.165 0.829,-11.294c0.183,-0.125 1.073,-0.111 1.242,0.015c0.169,0.129 -0.115,10.694 -0.003,11.279c-0.054,-0.036 -2.068,0 -2.068,0Z" style="stroke-width:1px;"/>
        <path d="M49.756,41.208l0.646,-0.003l0,-1.289c0,0 -0.398,-0.255 -0.639,-0.029c0.004,0.011 -0.007,1.321 -0.007,1.321l0,0Z" style="stroke-width:1px;"/>
        <rect x="50" y="37.274" width="0.37" height="0.481" style="stroke-width:0.5px;"/>
        <path d="M50.129,36.165l0.241,0l0,0.366l-0.237,0l-0.004,-0.366Z" style="stroke-width:0.25px;"/>
    </g>
    <text x="25.402px" y="117.589px" style="font-family:Times;font-size:18px;stroke:none;">Paving</text>
</g>
</a>
</svg>

CSS:

#svg {
    fill: #ECEDE8; /*eggshell*/
    color: #ECEDE8; /*eggshell*/
    stroke: #ECEDE8; /*eggshell*/
}

#svg:hover {
    fill: lightgreen;
    color: lightgreen;
    stroke: lightgreen; /*eggshell*/
}

#svg:visited {
    fill: #ECEDE8; /*eggshell*/
    color: #ECEDE8; /*eggshell*/
    stroke: #ECEDE8; /*eggshell*/
}

#circle {
    fill: #FF966A; /*lightorange*/
}

#rect {
    fill: none;
    stroke: none;
}

#text {
    font-size: 5px;
    fill: currentColor;
    stroke: none;
}

我意识到因为我正在设计 XML 样式，所以我处理这个问题的方式可能是错误的。如果是，有谁知道如何更改 xlink :visited 状态的样式？

Answer 1

如果您希望访问的颜色发生变化，请设置链接标签的样式，例如

a:visited { 
    fill: #ECEDE8; /*eggshell*/
    color: #ECEDE8; /*eggshell*/
    stroke: #ECEDE8; /*eggshell*/
}