在悬停行时,我需要更改primefaces数据表行颜色的默认灰色 enter image description here
答案 0 :(得分:0)
Primefaces使用的hove类似乎是.ui-state-hover
。
您将需要一个自定义CSS文件,在其中必须覆盖.ui-state-hover
背景颜色。
答案 1 :(得分:0)
通过定制以下类很容易定制素数数据表
.ui-datatable table{
border-collapse:collapse;width:100%;
}
.ui-datatable .ui-datatable-header,.ui-datatable .ui-datatable-footer{
text-align:center;padding:4px 10px;
}
.ui-datatable .ui-datatable-header{
border-bottom:0px none;
}
.ui-datatable .ui-datatable-footer{
border-top:0px none;
}
.ui-datatable thead th, .ui-datatable tfoot td{
text-align:center;
}
.ui-datatable thead th,.ui-datatable tbody td,.ui-datatable tfoot td{
padding:4px 10px;
overflow:hidden;
white-space:nowrap;
border-width:1px;
border-style:solid;
}
.ui-datatable tbody td{
border-color:inherit;
}
.ui-datatable .ui-sortable-column{
cursor:pointer;
}
.ui-datatable div.ui-dt-c{
position:relative;
}
.ui-datatable .ui-sortable-column-icon{
display:inline-block;
margin:-3px 0px -3px 2px;
}
.ui-datatable .ui-column-filter{
display:block;
width:100px;
margin:auto;
}
.ui-datatable .ui-expanded-row{
border-bottom:0px none;
}
.ui-datatable .ui-expanded-row-content{
border-top:0px none;
}
.ui-datatable .ui-row-toggler{
cursor:pointer;
}
.ui-datatable tr.ui-state-highlight{
cursor:pointer;
}
.ui-datatable .ui-selection-column .ui-chkbox-all{
display:block;
margin:0px auto;
width:16px;
height:16px;
}
.ui-datatable-scrollable table{
table-layout:fixed;
}
.ui-datatable-scrollable-body{
overflow:auto;
}
.ui-datatable-scrollable-header,.ui-datatable-scrollable-footer{
overflow:hidden;
border:0px none;
}
.ui-datatable-scrollable .ui-datatable-scrollable-header,.ui-datatable-scrollable .ui-datatable-scrollable-footer{
position:relative;
}
.ui-datatable-scrollable .ui-datatable-scrollable-header td{
font-weight:normal;
}
.ui-datatable-scrollable-body::-webkit-scrollbar{
-webkit-appearance:none;
width:15px;
background-color:transparent;
}
.ui-datatable-scrollable-body::-webkit-scrollbar-thumb{
border-radius:8px;
border:1px solid white;
background-color:rgba(194,194,194,.5);
}
.ui-datatable .ui-datatable-data tr.ui-state-hover{
border-color:inherit;
font-weight:inherit;
cursor:pointer;
}
.ui-datatable .ui-paginator,.ui-datatable .ui-paginator{
padding:2px;
}
.ui-column-dnd-top, ui-column-dnd-bottom{
display:none;
position:absolute;
}
.ui-column-dnd-top .ui-icon, ui-column-dnd-bottom .ui-icon{
position:absolute;
top:-4px;
}
/* InCell Editing */.ui-datatable .ui-cell-editor-input{
display:none;
}
.ui-datatable .ui-row-editing .ui-cell-editor .ui-cell-editor-output{
display:none;
}
.ui-datatable .ui-row-editing .ui-cell-editor .ui-cell-editor-input{
display:block;
}
.ui-datatable .ui-row-editor span{
cursor:pointer;
display:inline-block;
}
.ui-datatable .ui-row-editor .ui-icon-pencil{
display:inline-block;
}
.ui-datatable .ui-row-editing .ui-row-editor .ui-icon-pencil{
display:none;
}
.ui-datatable .ui-row-editor .ui-icon-check,.ui-datatable .ui-row-editor .ui-icon-close{
display:none;
}
.ui-datatable .ui-row-editing .ui-row-editor .ui-icon-check,.ui-datatable .ui-row-editing .ui-row-editor .ui-icon-close{
display:inline-block;
}
.ui-datatable .ui-datatable-data tr.ui-row-editing td.ui-editable-column,.ui-datatable .ui-datatable-data td.ui-cell-editing{
padding:0;margin:0;
}
/*resizer */.ui-datatable .ui-column-resizer{
width:8px;height:20px;
padding:0px;cursor:col-resize;
background-image:url("/ScraperOnWeb/javax.faces.resource/spacer/dot_clear.gif.jsf?ln=primefaces");
margin:-4px -10px -4px 0px;
float:right;
}
.ui-datatable .ui-filter-column .ui-column-resizer{
height:45px;
}
.ui-datatable .ui-column-resizer-helper{
width:1px;
position:absolute;
z-index:10;
display:none;
}
.ui-datatable-resizable{
padding-bottom:1px;/*fix for webkit overlow*/overflow:auto;
}
.ui-datatable-resizable table{
table-layout:fixed;
}
.ui-datatable-rtl{
direction:rtl;
}
.ui-datatable-rtl.ui-datatable thead th, .ui-datatable-rtl.ui-datatable tfoot td{
text-align:right;
}
希望对您有所帮助。
我的问题通过自定义以下类得到解决
.ui-datatable .ui-datatable-data tr.ui-state-hover.accept td {
color: black !important;
background-color: #DCEDC8 !important;
}