我想在访问链接后更改锚标记的颜色并模糊图像。但唯一的颜色是变化,图像看起来一样。 这是我的CSS代码
<style>
.image123{
padding-left:80px;
}
.imgContainer{
float:left;
margin: 93px;
}
a:link{
color:#000;
text-decoration:none;
}
a:visited {
color:#fafafc ;
text-decoration:none;
opacity:0.2 ;
filter:alpha(opacity=60);
}
</style>
这是我的HTML部分
<a href="breakdown_assistance_ins.php" id="ba" name="ba" >
<img src="images/breakdwn_assiatance.png" style="height:100px; width:100px;"/>
<p>Breakdown </p>
</a>
有谁能告诉我为什么我不能模糊图像并帮助我做同样的事情?
答案 0 :(得分:0)
将 display:inline-block; 添加到您的标记
.image123{
padding-left:80px;
}
.imgContainer{
float:left;
margin: 93px;
}
a:link{
color:#000;
text-decoration:none;
}
a:visited {
color:#fafafc ;
text-decoration:none;
opacity:0.2 ;
filter:alpha(opacity=60);
}
a{
display:inline-block; /* or block */
}
答案 1 :(得分:-1)
这应该可以解决问题:
<style>
a:visited img {
-webkit-filter: blur(4px);
filter: blur(4px);
}
</style>
您还可以在此处阅读有关过滤器的信息:https://developer.mozilla.org/en-US/docs/Web/CSS/filter
修改强>
进一步探索,正如@karthick nagarajan所述,浏览器已停止支持除以下属性之外的任何其他属性(Source):
以前给定的样式可以在除:visited
选择器之外的任何其他情况下使用。
此外,如前一个帖子(How can I detect visited and unvisited links on a page?)所述,无法通过Javascript检索这些链接的状态,这使得给定的示例在当前安全规范下无法实现。