Question

这只发生在Google Chrome中，我使用的是Chrome 17.0.928版本。这在firefox中运行良好，但在Google Chrome中使用蓝色下划线。

.thumbnail:hover{z-index: 50;text-decoration: none;position:relative;}
.thumbnail span{  position: absolute;background:#000;padding: 5px;left: -1000px;
 border: 0px solid #ddd;visibility: hidden;color: #fff;width:388px;height:190px;text-decoration: none;}
.thumbnail:hover span{ text-align:left;visibility: visible;top: 0;left: 110px;text- decoration:none; 
 top:-120px;-webkit-box-shadow: 0 8px 6px -6px #aaa; -moz-box-shadow: 0 8px 6px -6px   #aaa;box-shadow: 0 8px 6px -6px #aaa;}
.hoverbold {
text-decoration: none;
font-family: verdana;
font-size: 11px;
color: #B09F6E;
}

http://jsfiddle.net/NW8Nw/3/

Answer 1

实际上非常简单。你必须将链接分开，我用

摆脱它

.thumbnail a:link {
    text-decoration: none;       
}

您应该对a:hover，a:visited和a:active执行相同操作。

编辑：
很久以后，我意识到你只能用一个选择器来做到这一点：

.thumbnail a { text-decoration: none; }

Answer 2

删除链接的每个状态的装饰

a:link, a:visited, a:hover, a:active
{text-decoration:none;}

Answer 3

简单地：

.thumbnail a {
    text-decoration: none;
}

另外，您的<div>代码中有多个<a>个。 <a>标记只应包含内联元素。

Answer 4

我有同样的问题，因为我找不到可能的解决方案，我做了这个。

div {
      text-decoration:underline;
      text-decoration-color:white;
    }

此处您的文字装饰颜色和背景颜色应相同，从而隐藏蓝色下划线。希望这有帮助

如何删除谷歌浏览器中文本下的蓝色下划线？

4 个答案: