我想根据自己的意愿调整表格列的大小。我用的编码如下。
$('#Details').dataTable({
"columnDefs": [
{
"width": "30%",
"targets": 'no-sort',
"orderable": true
},{
"width": "10%",
"orderable": true,
},{
"width": "10%",
"orderable": true,
},{
"width": "10%",
"orderable": true,
},{
"width": "10%",
"orderable": true,
},{
"width": "15%",
"orderable": true,
},{
"width": "10%",
"orderable": true,
},{
"width": "5%",
"className": "dt-center",
"targets": 'no-sort',
"orderable": false,
}
],
});
但表格显示宽度不同。图片附在这里。
为什么这个不起作用?查询有什么问题吗?请帮助。
答案 0 :(得分:0)
您可以使用解决方案
$('#Details').dataTable({
"columnDefs": [
{
"width": "30%",
"orderable": true,
"targets": 0
},{
"width": "10%",
"orderable": true,
"targets": 1
},{
"width": "10%",
"orderable": true,
"targets": 2
},{
"width": "10%",
"orderable": true,
"targets": 3
},{
"width": "10%",
"orderable": true,
"targets": 4
},{
"width": "15%",
"orderable": true,
"targets": 5
},{
"width": "10%",
"orderable": true,
"targets": 6
},{
"width": "5%",
"className": "dt-center",
"targets": 7,
"orderable": false,
}
],
});
参考文档: https://datatables.net/forums/discussion/30530/set-fixed-column-width
希望这会对你有所帮助。
答案 1 :(得分:0)
添加此CSS,它会在您分配时设置您的表格布局:
#Details{
margin: 0 auto;
width: 100%;
clear: both;
border-collapse: collapse;
table-layout: fixed; // ***********add this
word-wrap:break-word; // ***********and this
}