在使用bootstrap table開發后台管理系統,表格利用bootstrap-table插件來實現,使用bootstrap-table過程中,會出現表頭錯位的情況
表頭對不齊效果:
解決的方法:
1、出現錯位的原因是因為設置了固定表頭 height 這個屬性,只要去掉這個屬性就不會出現錯位的現象(當然使用這種方法以后表頭就無法實現固定)
2、設置table的樣式,給table元素添加 table-layout:fixed;經測試可以解決錯位問題
有的時候當頁面中有多個表格使用bootstrap-table的height屬性以后,當瀏覽器的寬度發生改變是表頭還是會出現錯位的問題
解決的辦法就是在每一個設置完展示的table數據后面都要加上
$('#el').bootstrapTable({
})
$(window).resize(function () {
$("#el").bootstrapTable('resetView');
});
這樣可以解決一個頁面多個表格使用bootstrap-table的height屬性導致的表頭錯位問題