javascript方式
1.x的表格是bootstrap3实现的,因此完全支持bootstrap3的表格样式,具体参考:表格 · 全局 CSS 样式 · Bootstrap v3 中文文档,因此我们只需要通过js控制表格类就可实现控制grid样式的改变,将以下代码添加到grid实例化后面(位置很重要,不然可能不起作用),添加完后清除缓存强制刷新浏览器
- 条纹表格:table-striped
- 表格边框:table-bordered
- 紧缩表格:table-condensed
\Encore\Admin\Admin::script(' $(function(){ $(".grid-table").addClass("table-striped table-bordered table-condensed"); }) ');
css方式
直接重写table的css样式来改变,适合自定义样式,只需要添加到grid方法中就行
\Encore\Admin\Admin::style(' .table-responsive>.table{ border: 1px solid #eeeeee; } .table-responsive>.table>tbody>tr>td, .table-responsive>.table>tbody>tr>th, .table-responsive>.table>tfoot>tr>td, .table-responsive>.table>tfoot>tr>th, .table-responsive>.table>thead>tr>td, .table-responsive>.table>thead>tr>th { white-space:nowrap; border: 1px solid #777; } ');