hujung hadapan web
Tutorial Bootstrap
Bagaimana untuk berhijrah dari Bootstrap 4 ke Bootstrap 5?
Bagaimana untuk berhijrah dari Bootstrap 4 ke Bootstrap 5?
Keluarkan ketergantungan jQuery dan gantikan dengan vanila JavaScript untuk komponen bootstrap. 2. Kemas kini nama kelas seperti .float-kiri ke .float-start dan .ml-auto to .ms-auto. 3. Gantikan komponen yang dikeluarkan (misalnya, .media) dengan utiliti atau flexbox. 4. Gunakan objek global bootstrap untuk permulaan JavaScript (misalnya, bootstrap.modal baru ()). 5. Laraskan pendengar acara untuk menggunakan nama acara kecil (ditunjukkan.bs.modal). 6. Drop komponen yang tidak disokong (affix, panel, dan lain -lain) dan pastikan Popper V2 digunakan. 7. Interaktiviti ujian selepas memindahkan fail dan mengemas kini kod secara progresif.
Menaik taraf dari Bootstrap 4 ke Bootstrap 5 melibatkan beberapa perubahan utama. Proses ini bukan sekadar pertukaran versi mudah - terdapat perubahan perubahan, dependensi yang jatuh, dan komponen yang dikemas kini. Inilah cara untuk mengendalikan penghijrahan dengan lancar.
Keluarkan ketergantungan jQuery
Bootstrap 5 tidak lagi bergantung pada jQuery. Semua komponen JavaScript kini ditulis dalam vanila JavaScript.
- Padamkan sebarang tag skrip jQuery dari HTML anda jika ia hanya digunakan untuk bootstrap.
- Kemas kini skrip tersuai yang memanggil plugin jQuery bootstrap. Gantikan mereka dengan API berasaskan DOM baru.
- Sebagai contoh, bukan $ ('#modal'). Modal () , gunakan bootstrap.modal baru (document.getElementById ('modal')) .
Kemas kini nama dan utiliti kelas yang sudah lapuk
Beberapa kelas telah dinamakan semula atau dikeluarkan dalam Bootstrap 5.
- Tukar .float- kiri dan .
- Ganti .d-flex classes alignment : .ml-auto menjadi .ms-auto , dan .mr-auto menjadi .me-auto (permulaan/akhir bukan kiri/kanan).
- Drop .media Component - Ia dikeluarkan. Gunakan kelas utiliti atau flexbox secara langsung.
- Bentuk tersuai digantikan dengan kelas bentuk asli seperti .Form-Control dan .Form-check .
Laraskan permulaan dan peristiwa JavaScript
Cara bootstrap komponen JavaScript diasaskan telah berubah.
- Gunakan Objek Global Bootstrap : bootstrap.tooltip , bootstrap.popover , dll.
- Untuk mengaktifkan petua di seluruh dunia, jalankan: const toolTipTriggerList = document.QuerySelectorAll ('[data-bs-toggle = "tooltip"]') const toolTipList = [... toolTipTriggerList] .map (toolTipTriggereL => bootstrap.tooltip baru (toolTipTriggerel)))
- Nama peristiwa kini huruf kecil: ditunjukkan.bs.modal bukannya ditunjukkan.bs.modal (nama yang sama, tetapi memastikan konsistensi kes).
Semak komponen dan kebergantungan yang dijatuhkan
Sesetengah ciri telah dikeluarkan atau memerlukan pengendalian manual.
- JQuery tidak disokong - keluarkannya kecuali perpustakaan lain memerlukannya.
- Affix, panel, kecil, dan komponen yang baik - ganti dengan CSS tersuai atau markup alternatif.
- Sokongan Internet Explorer 10/11 digugurkan - jika anda mesti menyokong mereka, tinggal di Bootstrap 4.
- Pastikan proses binaan anda menggunakan Popper V2 (Bootstrap 5 memerlukannya untuk jatuh turun, alat tool, popovers).
Pada asasnya, berhijrah langkah demi langkah: Kemas kini fail CSS dan JS terlebih dahulu, menetapkan nama kelas, mengeluarkan jQuery, kemudian menyesuaikan permulaan JavaScript. Uji semua komponen interaktif dengan teliti. Ia mengambil masa, tetapi asas kod bersih dan respons yang lebih baik dalam Bootstrap 5 adalah berbaloi.
Atas ialah kandungan terperinci Bagaimana untuk berhijrah dari Bootstrap 4 ke Bootstrap 5?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Alat AI Hot
Undress AI Tool
Gambar buka pakaian secara percuma
Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik
AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.
Stock Market GPT
Penyelidikan pelaburan dikuasakan AI untuk keputusan yang lebih bijak
Artikel Panas
Alat panas
Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma
SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan
Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa
Dreamweaver CS6
Alat pembangunan web visual
SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)
Tutorial tentang memindahkan draf Douyin ke peranti baharu
Mar 26, 2024 pm 02:50 PM
Dalam perjalanan kreatif Douyin, pengguna mungkin telah menyunting draf Douyin dengan teliti pada satu telefon mudah alih, tetapi atas pelbagai sebab, ingin meneruskan penyuntingan atau menyelesaikan penerbitan pada telefon mudah alih yang lain. Tetapi saya tidak tahu bagaimana untuk memindahkan draf ke telefon lain. Tetapi jangan risau, sistem Douyin telah menyediakan kami fungsi migrasi yang mudah. Bagi pengguna yang masih belum tahu, datang dan ikuti artikel ini untuk melakukan penghijrahan dan terus membuat pada telefon baharu anda! Bagaimana untuk memindahkan draf Douyin ke telefon mudah alih lain? 1. Selepas membuka APP Douyin untuk memasuki antara muka, klik "Saya" di sudut kanan bawah untuk masuk, dan kemudian klik "Kotak Draf" di bawah kerja-kerja di halaman saya untuk membukanya. 2. Selepas memasukkan antara muka kotak draf, terdapat butang "Pilih" di bahagian atas kanan, klik padanya untuk masuk. 3. Seterusnya, setiap draf kerja kotak akan diterbitkan
Linux dan Docker: Bagaimana untuk memindahkan dan menyegerakkan bekas merentas hos?
Jul 29, 2023 pm 02:52 PM
Linux dan Docker: Bagaimana untuk memindahkan dan menyegerakkan bekas merentas hos? Ringkasan: Docker ialah teknologi kontena popular yang menyediakan penyelesaian virtualisasi yang ringan. Dalam persekitaran berbilang hos, adalah keperluan yang sangat biasa untuk memindahkan dan menyegerakkan bekas merentas hos. Artikel ini akan memperkenalkan cara menggunakan Linux dan Docker untuk melaksanakan penghijrahan silang hos dan penyegerakan bekas, dan menyediakan beberapa kod sampel untuk rujukan. Pengenalan Peningkatan teknologi kontena menjadikan penggunaan aplikasi dan migrasi lebih fleksibel dan cekap. pada berbilang hos
Cara memindahkan sejarah sembang WeChat ke telefon baharu
Mar 26, 2024 pm 04:48 PM
1. Buka aplikasi WeChat pada peranti lama, klik [Saya] di penjuru kanan sebelah bawah, pilih fungsi [Settings] dan klik [Chat]. 2. Pilih [Chat History Migration and Backup], klik [Migrate], dan pilih platform yang anda ingin pindahkan peranti. 3. Klik [Pilih sembang untuk dipindahkan], klik [Pilih semua] di penjuru kiri sebelah bawah, atau pilih rekod sembang sendiri. 4. Selepas memilih, klik [Mula] di sudut kanan bawah untuk log masuk ke akaun WeChat ini menggunakan peranti baharu. 5. Kemudian imbas kod QR untuk mula memindahkan rekod sembang Pengguna hanya perlu menunggu pemindahan selesai.
Bagaimana untuk melaksanakan migrasi pelayan dalam sistem Linux
Jun 18, 2023 pm 10:01 PM
Dalam sistem IT perusahaan, migrasi pelayan adalah tugas biasa, yang boleh membantu perusahaan meningkatkan penggunaan pelayan, memenuhi keperluan perniagaan, mengemas kini peralatan perkakasan, dsb. Walaupun terdapat cabaran tertentu dalam migrasi pelayan dalam sistem Linux, dengan perancangan dan pelaksanaan yang munasabah, kerja ini boleh dibuat mudah dan cekap. Di bawah, kami akan memperkenalkan beberapa langkah utama untuk migrasi pelayan dalam sistem Linux. Kerja penyediaan Sebelum melakukan migrasi pelayan, beberapa persediaan perlu dibuat pada pelayan sumber dan pelayan sasaran.
Cara memindahkan dan menyepadukan projek dalam GitLab
Oct 27, 2023 pm 05:53 PM
Cara memindahkan dan menyepadukan projek dalam GitLab Pengenalan: Dalam proses pembangunan perisian, migrasi dan penyepaduan projek adalah tugas penting. Sebagai platform pengehosan kod yang popular, GitLab menyediakan satu siri alatan dan fungsi yang mudah untuk menyokong penghijrahan dan penyepaduan projek. Artikel ini akan memperkenalkan langkah khusus untuk penghijrahan dan penyepaduan projek dalam GitLab dan menyediakan beberapa contoh kod untuk membantu pembaca memahami dengan lebih baik. 1. Penghijrahan projek Penghijrahan projek adalah untuk memindahkan pangkalan kod sedia ada daripada sistem pengurusan kod sumber kepada GitLab
Pemodenan Awan dengan C++: Memindahkan Aplikasi Legasi ke Awan
Jun 01, 2024 am 09:21 AM
Cara terbaik untuk mengalihkan aplikasi C++ warisan ke awan: Penyamaran semula: Pindahkan kod aplikasi ke platform asli awan (seperti Kubernetes) dan memanfaatkan perkhidmatan awan. Cloudization: Sebarkan aplikasi pada platform awan dan gunakan perkhidmatan awan tanpa pemfaktoran semula kod.
Bagaimana untuk memindahkan sejarah sembang WeChat ke telefon bimbit lain
May 08, 2024 am 11:20 AM
1. Pada peranti lama, klik "Saya" → "Tetapan" → "Sembang" → "Penghijrahan dan Sandaran Sejarah Sembang" → "Berhijrah". 2. Pilih peranti platform sasaran untuk dipindahkan, pilih rekod sembang untuk dipindahkan dan klik "Mula". 3. Log masuk dengan akaun WeChat yang sama pada peranti baharu dan imbas kod QR untuk memulakan penghijrahan sejarah sembang.
Bagaimana untuk memindahkan sejarah sembang WeChat ke telefon lain
Mar 26, 2024 pm 04:50 PM
Dengan membuka WeChat pada peranti lama, memilih "Penghijrahan dan Sandaran Sejarah Sembang" dan mengikut gesaan, pengguna boleh memindahkan sejarah sembang mereka ke peranti baharu. Proses migrasi melibatkan pemilihan sembang yang perlu dipindahkan, mengimbas kod QR dan menunggu migrasi selesai.
