表格文本悬停和链接颜色

Question

3

我有一个HTML表格及其布局（类似于这样，同时我也使用了Haml + Sass）：

.zebra{
 .zebra-stripe{
  &.zebra1{
  a{
    color: red;
  }
  a:hover{
    color: blue;
  }
 }
}

我的 HTML 表格有一个名为 zebra 的类，tr 元素具有类 .zebra-stripe .zebra1。

但是我有一个链接使用了其他样式（例如按钮），这个链接有自己的高度和背景，但是在悬停时颜色被设置为橙色。

.details-link{
  width: 70px;
  margin: 2px;
}
.details-link:hover{
  color: orange;
}

但是当我的鼠标悬停在这个链接上时，它的颜色不是橙色，而是像表格设置的蓝色...出了什么问题？

如何将链接悬停文本颜色设置为橙色（我已经设置了，但它没有正确显示）...

如果有什么不清楚的，请在评论中写给我...

- brabertaser19

2

@Daniel Imms：标签应该描述问题，而不是答案。由于从问题中并不立即明显地看出问题在于选择器的特异性，因此强制将标签放入问题中是不合适的。也没有必要在每个问题上填写所有5个标签-像[hover]这样的标签在这里并不是非常有效。 - BoltClock

2个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- web2008 · Answer 1

试试这个：

a.details-link:hover{
    color: orange;
}

- Daniel Imms · Answer 2

你的问题在于你使用的选择器过于具体，.zebra .zebra-stripe.zebra1 a:hover 比 .details-link:hover 更具体。尝试使用以下更具体的选择器来解决此问题：

.zebra .zebra-stripe.zebra1 a.details-link:hover {
    color: orange;
}