关于datatables自适应以及自定义列宽度的总结

 

 

table-layout:fixed;可以自定义列的宽度

<div id="bizhi" style="width:100%;height: 85%;overflow-x: auto;">
                        <table id="data_table" class=""  style="width:100%;height: 100%;table-layout:fixed;font-size: 0.2rem !important;">
                                <thead>
                                    <tr>
                                        <!--<th rowspan="2" style="width: 5px !important;">序号</th>-->
                                        <!--<th rowspan="2" style="width: 120px !important;">供热站</th>
                                        <th colspan="5" style="width: 270px !important;">消耗指标</th>-->
                                        <th rowspan="2" style="width: 36% !important;">供热站</th>
                                        <th colspan="5" style="width: 64% !important;">消耗指标</th>
                                    </tr>
                                    <tr>
                                        <th>氧化钙</th>
                                        <th>NaOH溶液</th>
                                        <th>NaOH片碱</th>
                                        <th>尿素</th>
                                        <th>工业盐</th>
                                    </tr>
                                </thead>
                        </table>
                    </div>

//tab切换时会使表头元素宽度无法识别，先设置一个定时器，刚开始让所有的table的div都显示，在页面打开若干秒或者毫秒之后，让不该显示的div隐藏就好了hide（），
        setTimeout(function(){$("#changzhi").hide()},1000)