2017-08-17 28 views
0

我试图改变悬浮颜色的响应表,但失败了一个简单的技巧。更改悬浮颜色的响应表

我尝试链接CSS但失败。

是否需要添加更多CSS标签才能实现此目的。

请你帮我理解我的方法有什么问题。

这里是我的代码:

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <script> 
.table-hover thead tr:hover th, .table-hover tbody tr:hover td { 
    background-color: #FF0000; 
} 
    </script> 
</head> 
<body> 

<div class="container"> 
    <h2>Table</h2> 
    <p>The .table-hover class enables a hover state on table rows within a tbody:</p> 

<table class="table table-hover"> 
    <thead> 
     <tr> 
      <th>Firstname</th> 
      <th>Lastname</th> 
      <th>Email</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td>John</td> 
      <td>Doe</td> 
      <td>[email protected]</td> 
     </tr> 
     <tr> 
      <td>Mary</td> 
      <td>Moe</td> 
      <td>[email protected]</td> 
     </tr> 
     <tr> 
      <td>July</td> 
      <td>Dooley</td> 
      <td>[email protected]</td> 
     </tr> 
    </tbody> 

    </table> 
</div> 

</body> 
</html> 
+0

它是为我工作的罚款 – user8256287

+0

感谢杰森。你能确认你是否能看到悬停或灰色的红色。其实我想要悬停的红色,但我可以看到灰色的颜色 –

回答

0

你必须把风格,而不是脚本对CSS

这里使其:

<style> 
.table-hover thead tr:hover th, .table-hover tbody tr:hover td { 
    background-color: #FF0000; 
} 
</style>