bootstrap3のテーブルのhoverの際の色を変える
自分みたいなコテコテのエンジニア気質であっても、現代のWebでは最低限表示要素の管理をしないとjavascript系の操作が出来ない。
そしてページデザインを要しないbootstrapでのプロトタイプを先行して作成する。等のモックアップの作成等も必要となってくる。
特に管理画面等で必要になるのがデータ一覧ページでtableを使う場合に自分のカーソルが今どこに当たっているか。と言う事が常設されたBootstrapのclassだと色が控えめで見辛い。
モニタのコントラストが強めだとそうでもないのだが、薄めにしていると変化していないように見える。
ページのヘッダに一文スタイルを適用してtable-hoverに一手間入れる。
<style type="text/css">
.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
background-color: #ffe4c4;
}
</style>
色は任意で良い。カラーコードを見て自分の好きな色を選択する。
これでテーブルにカーソルが当たった場合の背景色を動的に変更出来る。コピペで済むのでメモ