Rumah hujung hadapan web tutorial js jQuery Datatables表头不对齐的解决办法

jQuery Datatables表头不对齐的解决办法

Dec 07, 2017 pm 03:57 PM
datatables jquery selesaikan

我们用Datatables经常会遇到这种情况,就是浏览器或者HTML里元素改变大小或分辨率后,标题就会出现不对齐现象。这种情况是因为Datatables框架中使用到serverSide : true,// 服务器查询数据属性,它会使Table标签中多一个style="width:**px;"属性,这就导致了变化大小时标题对不齐现象。本文我们主要给大家分享jQuery Datatables表头不对齐的解决办法,希望能帮助到大家。


<table id="example" class="table table-border table-bordered table-bg table-hover table-sort"> 
 <thead> 
 <tr class="text-c"> 
  <th width="25"> 
  <input type="checkbox" name="checkAll" class="checkall" onclick="checkedClean();"> 
  </th> 
  <th width="100">名称</th> 
  <th width="100">说明</th> 
  <th width="100">类型</th> 
  <th width="60">是否默认</th> 
  <th width="20">状态</th> 
  <th width="100"></th> 
 </thead> 
 <tbody> 
 </tbody> 
</table>
Salin selepas log masuk


解决方法


#example{ 
 width: 100% !important; 
}
Salin selepas log masuk


如果遇到设有横向滚动条时,就固定设置Table宽度


#example{ 
 width: ***px !important; 
}
Salin selepas log masuk


收工,这样就完美解决了!!

相关推荐:

jquery插件datatables属性介绍及创建分页、排序实例详解

jQuery datatables是什么?datatables如何使用?

jquery+php实现导出datatables插件数据到excel的方法,jquerydatatables_PHP教程

Atas ialah kandungan terperinci jQuery Datatables表头不对齐的解决办法. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Tetapan grafik terbaik
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Cara Memperbaiki Audio Jika anda tidak dapat mendengar sesiapa
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Cara Membuka Segala -galanya Di Myrise
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Penyelesaian kepada masalah bahawa sistem Win11 tidak dapat memasang pek bahasa Cina Penyelesaian kepada masalah bahawa sistem Win11 tidak dapat memasang pek bahasa Cina Mar 09, 2024 am 09:48 AM

Penyelesaian kepada masalah sistem Win11 tidak dapat memasang pek bahasa Cina Dengan pelancaran sistem Windows 11, ramai pengguna mula menaik taraf sistem pengendalian mereka untuk mengalami fungsi dan antara muka baharu. Walau bagaimanapun, sesetengah pengguna mendapati bahawa mereka tidak dapat memasang pek bahasa Cina selepas menaik taraf, yang menyusahkan pengalaman mereka. Dalam artikel ini, kami akan membincangkan sebab mengapa sistem Win11 tidak dapat memasang pek bahasa Cina dan menyediakan beberapa penyelesaian untuk membantu pengguna menyelesaikan masalah ini. Analisis sebab Pertama, mari kita menganalisis ketidakupayaan sistem Win11 untuk

Lima petua untuk mengajar anda cara menyelesaikan masalah telefon Black Shark tidak dihidupkan! Lima petua untuk mengajar anda cara menyelesaikan masalah telefon Black Shark tidak dihidupkan! Mar 24, 2024 pm 12:27 PM

Apabila teknologi telefon pintar terus berkembang, telefon bimbit memainkan peranan yang semakin penting dalam kehidupan seharian kita. Sebagai telefon perdana yang memfokuskan pada prestasi permainan, telefon Black Shark sangat digemari oleh pemain. Namun, kadangkala kita juga menghadapi situasi telefon Black Shark tidak boleh dihidupkan Pada masa ini, kita perlu mengambil beberapa langkah untuk menyelesaikan masalah ini. Seterusnya, izinkan kami berkongsi lima petua untuk mengajar anda cara menyelesaikan masalah telefon Black Shark tidak dihidupkan: Langkah 1: Periksa kuasa bateri Pertama, pastikan telefon Black Shark anda mempunyai kuasa yang mencukupi. Ia mungkin kerana bateri telefon telah habis

Pemacu tidak boleh dimuatkan pada peranti ini Bagaimana untuk menyelesaikannya? (Diuji secara peribadi dan sah) Pemacu tidak boleh dimuatkan pada peranti ini Bagaimana untuk menyelesaikannya? (Diuji secara peribadi dan sah) Mar 14, 2024 pm 09:00 PM

Semua orang tahu bahawa jika komputer tidak dapat memuatkan pemacu, peranti mungkin tidak berfungsi dengan betul atau berinteraksi dengan komputer dengan betul. Jadi bagaimana kita menyelesaikan masalah apabila kotak gesaan muncul pada komputer bahawa pemandu tidak boleh dimuatkan pada peranti ini? Editor di bawah akan mengajar anda dua cara untuk menyelesaikan masalah dengan mudah. Tidak dapat memuatkan pemacu pada peranti ini Penyelesaian 1. Cari "Pengasingan Kernel" dalam menu Mula. 2. Matikan Integriti Memori, dan ia akan menggesa "Integriti Memori telah dimatikan. Peranti anda mungkin terdedah. Klik di belakang untuk mengabaikannya, dan ia tidak akan menjejaskan penggunaan." 3. Masalah boleh diselesaikan selepas menghidupkan semula mesin.

Bagaimana untuk menyelesaikan masalah menyimpan gambar secara automatik semasa menerbitkan di Xiaohongshu? Di manakah imej yang disimpan secara automatik semasa menyiarkan? Bagaimana untuk menyelesaikan masalah menyimpan gambar secara automatik semasa menerbitkan di Xiaohongshu? Di manakah imej yang disimpan secara automatik semasa menyiarkan? Mar 22, 2024 am 08:06 AM

Dengan perkembangan media sosial yang berterusan, Xiaohongshu telah menjadi platform untuk lebih ramai golongan muda berkongsi kehidupan mereka dan menemui perkara yang indah. Ramai pengguna bermasalah dengan isu autosimpan semasa menyiarkan imej. Jadi, bagaimana untuk menyelesaikan masalah ini? 1. Bagaimana untuk menyelesaikan masalah menyimpan gambar secara automatik semasa menerbitkan di Xiaohongshu? 1. Kosongkan cache Pertama, kita boleh cuba mengosongkan data cache Xiaohongshu. Langkah-langkahnya adalah seperti berikut: (1) Buka Xiaohongshu dan klik butang "Saya" di sudut kanan bawah (2) Pada halaman tengah peribadi, cari "Tetapan" dan klik padanya (3) Tatal ke bawah dan cari "; Kosongkan Cache". Klik OK. Selepas mengosongkan cache, masukkan semula Xiaohongshu dan cuba siarkan gambar untuk melihat sama ada masalah penjimatan automatik telah diselesaikan. 2. Kemas kini versi Xiaohongshu untuk memastikan bahawa Xiaohongshu anda

Mentafsir ralat Oracle 3114: punca dan penyelesaian Mentafsir ralat Oracle 3114: punca dan penyelesaian Mar 08, 2024 pm 03:42 PM

Tajuk: Analisis Ralat Oracle 3114: Punca dan Penyelesaian Apabila menggunakan pangkalan data Oracle, anda sering menghadapi pelbagai kod ralat, antaranya ralat 3114 adalah yang biasa. Ralat ini biasanya melibatkan masalah pautan pangkalan data, yang mungkin menyebabkan pengecualian apabila mengakses pangkalan data. Artikel ini akan mentafsir ralat Oracle 3114, membincangkan puncanya dan memberikan kaedah khusus untuk menyelesaikan ralat dan contoh kod yang berkaitan. 1. Definisi ralat 3114 ralat Oracle 3114 lulus

Panduan untuk menyelesaikan masalah pemasangan WordPress dalam satu artikel Panduan untuk menyelesaikan masalah pemasangan WordPress dalam satu artikel Feb 29, 2024 am 11:06 AM

WordPress ialah sistem pengurusan kandungan sumber terbuka yang sangat popular Ramai pengguna dan perniagaan individu memilih untuk menggunakan WordPress untuk membina dan mengurus tapak web mereka sendiri. Walau bagaimanapun, semasa pemasangan WordPress, anda kadangkala menghadapi beberapa masalah, seperti ralat sambungan pangkalan data, isu kebenaran fail, dsb. Artikel ini akan memberikan panduan untuk menyelesaikan masalah pemasangan WordPress biasa dan membantu pengguna menyelesaikan masalah dengan cepat melalui contoh kod tertentu. Masalah 1: Ralat sambungan pangkalan data semasa memasang WordPress

Adakah anda bimbang tentang kod kacau-balau WordPress? Cuba penyelesaian ini Adakah anda bimbang tentang kod kacau-balau WordPress? Cuba penyelesaian ini Mar 05, 2024 pm 09:27 PM

Adakah anda bimbang tentang kod berantakan bahagian belakang WordPress? Cuba penyelesaian ini, contoh kod khusus diperlukan Dengan aplikasi WordPress yang meluas dalam pembinaan laman web, ramai pengguna mungkin menghadapi masalah kod bercelaru di bahagian belakang WordPress. Masalah seperti ini akan menyebabkan antara muka pengurusan latar belakang memaparkan aksara bercelaru, menyebabkan masalah besar kepada pengguna. Artikel ini akan memperkenalkan beberapa penyelesaian biasa untuk membantu pengguna menyelesaikan masalah watak bercelaru dalam bahagian belakang WordPress. Ubah suai fail wp-config.php dan buka wp-config.

Bagaimana untuk menyelesaikan masalah aksara yang kacau apabila mengimport data Cina ke Oracle? Bagaimana untuk menyelesaikan masalah aksara yang kacau apabila mengimport data Cina ke Oracle? Mar 10, 2024 am 09:54 AM

Tajuk: Kaedah dan contoh kod untuk menyelesaikan masalah aksara bercelaru apabila mengimport data Cina ke dalam Oracle Apabila mengimport data Cina ke pangkalan data Oracle, aksara bercelaru sering muncul Ini mungkin disebabkan oleh tetapan set aksara pangkalan data atau masalah penukaran pengekodan semasa import proses. . Untuk menyelesaikan masalah ini, kami boleh mengambil beberapa kaedah untuk memastikan data Cina yang diimport dapat dipaparkan dengan betul. Berikut ialah beberapa penyelesaian dan contoh kod khusus: 1. Semak tetapan set aksara pangkalan data Dalam pangkalan data Oracle, tetapan set aksara adalah

See all articles