Cara Membuka Kotak Modal Bootstrap

Langkah-langkah untuk membuka kotak modal dalam bootstrap adalah seperti berikut: Tentukan bekas kotak modal, termasuk kelas. Modal dan. Tambah data atribut data-bs-toggle = "modal" dan id kotak modal ke pencetus (seperti butang atau pautan). Inisialisasi kotak modal, pilih ID kotak modal dan panggil kaedah pertunjukan.

Cara Membuka Kotak Modal di Bootstrap

Langkah untuk membuka kotak modal:

1. Tentukan Kotak Modal:

   • Buat elemen kotak modal dalam HTML, termasuk kelas .modal dan id unik.
   • Tambah .modal-dialog dan kontena .modal-content .
   • Letakkan kandungan kotak modal (seperti tajuk, badan, dan butang) dalam .modal-content .

2. Tambah pencetus:

   • Buat butang atau pautan dan klik untuk mencetuskan kotak modal untuk dibuka.
   • Gunakan harta bootstrap data-bs-toggle="modal" dan tetapkan nilainya ke id kotak modal.

3. Mulakan kotak modal:

   • Dalam JavaScript, kotak modal diasaskan supaya ia dapat dibuka melalui pencetus.
   • Gunakan kelas Modal dan pilih kotak modal mengikut id .
   • Hubungi kaedah show untuk membuka kotak modal.

Contoh kod:

 <code class="html"><!-- 定义模态框--> <div class="modal fade" id="my-modal"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"></div>
</div>
</div>
</div></code>

Atas ialah kandungan terperinci Cara Membuka Kotak Modal Bootstrap. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!