表格文本悬停和链接颜色

时间:2013-03-28 10:32:04

标签: html css css-selectors css-specificity

我有html表和布局(类似的东西,我也使用haml + sass):

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

我的htm表有类斑马,tr有类.zebra-stripe .zebra1

但我有其他风格的链接(如按钮),此链接有自己的背景高度,但悬停时颜色设置为橙色,

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

但是当我的鼠标悬停在此链接上时,它的颜色不是橙色,而是为表设置的蓝色......出了什么问题?

如何将链接悬停文本颜色设置为橙色(我设置了它,但它没有正确查看)....

如果不清楚,请在评论中写下我......

2 个答案:

答案 0 :(得分:0)

试试这个:

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

答案 1 :(得分:0)

您的问题是您使用的选择器的特异性,.zebra .zebra-stripe.zebra1 a:hover.details-link:hover更具体。请尝试以下方法,以使您的选择器更具体:

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