java PrimeFaces在datatable中自定义行编辑器 5 月,2 周 Questions & Answers 9310 有没有办法自定义rowEditor按钮?我的意思是,如果可以更改图像或添加文本。 如果不可能,是否有办法通过另一个控件(如按钮或链接)获得相同的行为
# 1 楼答案 只需使用CSS。下面的示例假设您希望将其应用于所有datatables/RowEditor,并在/resources/images文件夹中具有所需的图像文件 .ui-datatable .ui-row-editor .ui-icon-pencil { background-image: url("#{resource['images/pencil.png']}"); } .ui-datatable .ui-row-editor .ui-icon-check { background-image: url("#{resource['images/check.png']}"); } .ui-datatable .ui-row-editor .ui-icon-close { background-image: url("#{resource['images/close.png']}"); } 另请参见: How do I override default PrimeFaces CSS with custom styles?
# 2 楼答案 此外,如果您想使用“Font Awesome”中的fa图标,可以从Font Awesome复制分配给它们的粘贴类。css .ui-datatable table tbody tr td .ui-row-editor .ui-icon-pencil { background: none !important; text-indent: initial; /* display: inline-block; */ font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; transform: translate(0, 0); } .ui-datatable table tbody tr td .ui-row-editor .ui-icon-pencil:before { content: "\f044"; } .ui-datatable table tbody tr td .ui-row-editor .ui-icon-pencil:hover { font-weight: bold; }
# 1 楼答案
只需使用CSS。下面的示例假设您希望将其应用于所有datatables/RowEditor,并在
/resources/images
文件夹中具有所需的图像文件另请参见:
# 2 楼答案
此外,如果您想使用“Font Awesome”中的fa图标,可以从Font Awesome复制分配给它们的粘贴类。css