Question

目标：
将“＃”和“名字”中的th设置为在悬停中具有背景颜色黄色

问题：
我不知道如何解决它。

信息：
在这种情况下，我不能使用<thead>和<body>，我正在使用Bootstrap和jQuery。

.makeThisOpacity {
    opacity: 0;
}
.makeThisOpacity: hover {
    background-color: yellow;
}

<html lang="en">

<head>
    <title></title>
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.css" rel="stylesheet" />
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
    <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
</head>

<body>
    <br>
    <table class="table table-hover">
        <tr>
            <th class="makeThisOpacity">#</th>
            <th class="makeThisOpacity">>First Name</th>
            <th>Last Name</th>
            <th>Username</th>
        </tr>
        <tr>
            <td>1</td>
            <td>Mark</td>
            <td>Otto</td>
            <td>@mdo</td>
        </tr>
    </table>
</body>

</html>

Answer 1

.makeThisOpacity悬停时opacity: 0,将其更改为1

试试这个，

.makeThisOpacity {
    opacity: 0;
}
.makeThisOpacity:hover { 
    background-color: yellow;
    opacity: 1;
}

Answer 2

不透明度：0会使文字完全不可见。

.makeThisOpacity {
    opacity: 0;// remove it
}

.makeThisOpacity:hover { 
     background-color: yellow;
     //if you want to use opacity as 0 then to display it increase your opacity, or else remove it.
     opacity: 0.5; // remove if your initial opacity is not 0.

}

在悬停中更改背景颜色

2 个答案: