2015-10-24 70 views
0

因此,我决定在我正在处理的网站中使用一些SVG。他们不是内联HTML;相反,我使用object标签链接到它们。我使用它们作为链接,并且我使用了xlink方法。我用CSS来设计它们,除了一件事情之外,它工作正常。 :visited状态似乎有它自己的默认样式,而且:visited选择器在CSS中没有响应,所以我无法摆脱这种默认样式。有任何想法吗?如何删除xlink默认样式

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状态的样式吗?

+0

啊,是的。我一直在看这个太久了。谢谢。 – LeviJames

+0

转换为答案,因为这似乎适用于你。 –

+0

感谢您的帮助。 – LeviJames

回答

0

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

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