如何删除xlink默认样式

时间:2015-10-24 21:33:07

标签: css svg xlink

所以我决定在我正在研究的网站上使用一些SVG。它们不是内联HTML;相反,我使用object标签链接到它们。我正在使用它们作为链接,我走了使用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状态的样式?

1 个答案:

答案 0 :(得分:0)

如果您希望访问的颜色发生变化,请设置链接标记的样式。

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