15

ツイッターブートストラップからtr：hoverスタイルを削除して、ホバーで行のハイライトを取得せずにテーブルスタイルを使用できるようにする簡単な方法はありますか？

4

2 に答える 2

24

@Blenderの答えは正しいですが、テーブルでクラスを使用していない場合に限ります。.table-striped

クラスを使用している場合.table-striped、明るい灰色のストライプのある行にカーソルを合わせても、行のハイライトは消えません。

ライトグレーの行にカーソルを合わせると、行がライトグレーから透明（白）に変わるため、ライトグレーのすべての行に誤って行ホバー効果を実装することになります。

縞模様の行からもホバー効果を取り除く必要があり、Blenderの元の答えに基づいて構築する必要がある場合は、オーバーライドする別のルールがあると思います。

.table tbody tr:hover td,
.table tbody tr:hover th {
  background-color: transparent;
}


.table-striped tbody tr:nth-child(odd):hover td {
   background-color: #F9F9F9;
}

良い例：.table-stripedクラスが考慮されている実際のjsfiddleの例へのリンクは次のとおりです：http： //jsfiddle.net/pXWjq/

バグのある例：そして、灰色の行のホバーが考慮されていないために、テーブルの行のホバーが（灰色の行で）まだ発生する例を次に示します：http： //jsfiddle.net/448Rb/

。

于 2012-05-26T03:37:30.130 に答える
16

これらのルールを上書きします。

.table tbody tr:hover td,
.table tbody tr:hover th {
  background-color: #f5f5f5;
}

これを使用する：

.table tbody tr:hover td,
.table tbody tr:hover th {
  background-color: transparent;
}
于 2012-05-26T02:36:19.850 に答える