Question

我正在尝试使用.category-value类悬停在div上的month-hover课程中突出显示文字以应用#197ABF颜色。 ie。，“Jan”文字在悬停在div上时应为#197ABF颜色。

我尝试应用以下CSS，但无效（仅在鼠标悬停在Jan或Feb上时突出显示。）

.month-hover>.category-title:hover{
    color:#197ABF;
}

Plunker链接here

Answer 1

您忘记了.课前的点（category-title）：

.month-hover > .category-title:hover {
    color: #197ABF;
}

Answer 2

这适用于，父类和子类。这会在悬停时改变文本的颜色。（错过.）

.month-hover .category-title:hover{
    color:#197ABF;
}

当div悬停很简单时，要更改文本的颜色，

完整代码：

＆＃13;

.margin-set{
  margin:35px;
}
.category-title{
  font-size:15px;
}
.category-value{
  font-size:45px;
  color:#197ABF;
}

.month-hover{
    cursor: pointer;
    border: solid transparent 2px;
}
.month-hover:hover {
    border-color: #197ABF;
    color:#197ABF;
}
/*.month-hover>.category-title:hover{
    color:#197ABF;
}
.month-hover >.category-title:hover{
    color:#197ABF;
} */

＆＃13;

<!DOCTYPE html>
<html>

  <head>
    <link data-require="bootstrap-css@3.2.0" data-semver="3.2.0" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
    <link rel="stylesheet" href="bootstrap-5-columns.css" />
        <link rel="stylesheet" href="style.css" />

  </head>

  <body>
    <div class="container margin-set">
      <div class="row">
      <div class=" col-md-6 month-hover">
        <div class="col-sm-5th-2 category-title">Jan</div>
        <div class="col-sm-5th-3  category-value">2017</div>
      </div>
       <div class=" col-md-6 month-hover">
        <div class="col-sm-5th-2 category-title">Feb</div>
        <div class="col-sm-5th-3  category-value">2017</div>
      </div>
      </div>
    </div>
  </body>

</html>

＆＃13;

只需在div的悬停中添加颜色。

<强>结果：

（蓝色箭头是鼠标所在的位置）

Answer 3

这可行吗

        PostBackOptions postBackOptions = new PostBackOptions(SearchButton);
        postBackOptions.ActionUrl = "/searchdesc";
        SearchButton.Attributes.Add("onclick",
        Page.ClientScript.GetPostBackEventReference(postBackOptions));

突出显示悬停值

3 个答案: