爲了突出當前徘徊，在HTML表格的行和列

Question

我想能夠使用引導3或/和純CSS爲了亮點當前使用CSS和Bootstrap 3在html表格的行和列上徘徊。

這可能不使用自定義JavaScript和保持Bootstrap表的響應性？

任何人都可以提供建議和/或鏈接？

Answer 1

添加.table-hover，使上表中的行懸停狀態

<table class="table table-hover"> 
    ... 
</table 

創建.table-responsive類父div來響應性

<div class="table-responsive"> 
    <table class="table table-hover"> 
    ... 
    </table> 
</div> 

UPDATE

解決方案與:nth-child()識別:hover列號

演示http://jsfiddle.net/kGz9E/

參考：http://getbootstrap.com/css/#tables

Answer 2

*** bootstrap-3.3.7 *** 

You are using *bootstrap.min.css* or *bootstrap.css*. 

1.Open *bootstrap.min.css* or *bootstrap.css* 
    that you include with *link tag* in your html file. 


2.Find the code below in *bootstrap.min.css* or *bootstrap.css* 
    whose class name is *table-hover*. 

.table-hover > tbody > tr:hover { 
    background-color: #f5f5f5; 
} 
table col[class*="col-"] { 
    position: static; 
    display: table-column; 
    float: none; 
} 

3.Paste the new code below after the above code 
    whose class name is *table-hoverCell*. 

.table-hoverCell > tbody > tr > td:hover { 
    background-color: #f5f5f5; 
} 
table col[class*="col-"] { 
    position: static; 
    display: table-column; 
    float: none; 
} 

4.The final appearance is like this 

.table-hover > tbody > tr:hover { 
    background-color: #f5f5f5; 
} 
table col[class*="col-"] { 
    position: static; 
    display: table-column; 
    float: none; 
} 
.table-hoverCell > tbody > tr > td:hover { 
    background-color: #f5f5f5; 
} 
table col[class*="col-"] { 
    position: static; 
    display: table-column; 
    float: none; 
} 

*** I use *bootstrap.css* for this explanation 
    so final appearance is different from *bootstrap.min.css*. 
    The code in *bootstrap.min.css* is written without any linebreaks 
    so you can easily do find and paste using *bootstrap.css*. ***