layuitable表格设置透明
layui table 表格设置透明
通过css来控制，直接上代码
⾸先需要将table标签放⼊div中,div增加class名称 transparentDataTable ,
如果是静态表格，则增加transparentStaticTable ，然后引⼊此css⽂件即可.
/**
设置表透明  start=========================================================================================================== =========
*/
.transparentDataTable .layui-table{
background-color: transparent !important;
}
.transparentDataTable .layui-table-view{
background-color:rgba(0, 0, 0, 0.5)!important;
}
.transparentDataTable .layui-table-tool{
background-color: transparent !important;
}
.transparentDataTable .layui-table-tool .layui-icon{
color: white;
}
.transparentDataTable .layui-table-header, .transparentDataTable .layui-table-cell, .layui-table-header thead tr{
background-color: transparent !important;
}
.transparentDataTable .layui-table-header thead th, .transparentDataTable .layui-none{
/*border: 1px solid #FFFFFF;*/
color: white !important;
}
.transparentDataTable .layui-table tbody tr{
border: 1px solid #FFFFFF;
color: white;
}
.transparentDataTable .layui-table-init, .transparentDataTable .layui-laypage-limits select, .transparentDataTable .layui-laypage-btn, .transparentDataTable  .layui-laypage-skip input{
background-color: transparent !important;
color: white;
}
.transparentDataTable .layui-table-page a, .transparentDataTable .layui-table-page span{
color: white !important;
}
.transparentDataTable .layui-laypage-limits select, .transparentDataTable .layui-laypage-limits option{
-webkit-appearance: none;/* google */
-moz-appearance: none;/* firefox */
appearance: none;/* IE */
-webkit-tap-highlight-color:rgba(0, 0, 0, 0);/* 点击去除⾼亮的颜⾊*/
background-color:rgba(0, 0, 0, 0.5)!important;
color: white;
}
.transparentDataTable .layui-table[lay-even] tr:nth-child(even){
.transparentDataTable .layui-table[lay-even] tr:nth-child(even){
background-color:rgba(180, 238, 180, 0.5)!important;
table设置内边框}
/*静态表格透明*/
.transparentStaticTable .layui-table{
background-color:rgba(0, 0, 0, 0.5)!important;
}
.
transparentStaticTable .layui-table tbody tr:hover, .statistics_branch_one .layui-table tbody tr:hover{
background-color: transparent !important;
}
/*.statistics_table_opacity {*/
/*    background-color: rgba(0, 0, 0, 0.5) !important;*/
/*}*/
/*设置表透明  end============================================================================================================ ========*/

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。