Bagaimanakah kelas Bootstrap \'mb-0\' mempengaruhi margin elemen?

Memahami Class="mb-0" dalam Bootstrap 4

Bootstrap 4 menyediakan kelas utiliti yang komprehensif untuk mengurus margin dan padding merentas saiz skrin yang berbeza, dikenali sebagai mb ( margin bawah) kelas. Kelas ini menawarkan fleksibiliti dalam menetapkan jarak elemen untuk port pandangan yang berbeza-beza, seperti yang diterangkan di bawah:

Memahami class="mb-0"

The class="mb-0" secara khusus menyasarkan margin bawah elemen dan menetapkannya kepada 0. Kelas ini berada di bawah kategori kelas utiliti margin dan digunakan untuk mengalih keluar margin bawah sepenuhnya.

Format Kelas Utiliti Bootstrap dan Padding

Bootstrap menggunakan konvensyen penamaan yang konsisten untuk kelas utiliti margin dan pelapiknya:

{property}{sides}-{size} atau {property }{sides}-{breakpoint}-{saiz}

Harta:

• m untuk margin
• p untuk padding

Sisi:

• t untuk atas
• b untuk bawah
• l untuk kiri
• r untuk kanan
• x untuk kiri dan kanan
• y untuk atas dan bawah

Titik putus:

• xs untuk
• sm untuk >=576px
• md untuk >=768px
• lg untuk >=992px
• xl untuk >=1200px

Saiz:

• 0 menetapkan margin atau padding kepada 0
• 1 set a jidar atau padding kepada .25rem (4px)
• 2 menetapkan jidar atau padding kepada .5rem (8px)
• 3 tetapkan jidar atau padding kepada 1rem (16px)
• 4 tetapkan jidar atau padding kepada 1.5rem (24px)
• 5 set margin atau padding kepada 3rem (48px)
• auto set margin kepada auto

Contoh Penggunaan

<code class="html"><p class="mb-0">Lorem ipsum</p></code>

Kod ini menggunakan class="mb-0" pada elemen perenggan, mengalih keluar jidar bawahnya.

Sumber Tambahan

Untuk maklumat yang lebih komprehensif, rujuk sumber berikut:

• [Bootstrap 4.5 - Spacing](https://getbootstrap.com/docs/4.5/utilities/spacing /)
• [w3schools: Bootstrap Margin dan Kelas Padding](https://www.w3schools.com/bootstrap4/bootstrap_margin_padding.asp)

Atas ialah kandungan terperinci Bagaimanakah kelas Bootstrap \'mb-0\' mempengaruhi margin elemen?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!