Bagaimana untuk Mengeluarkan Ruang Longkang daripada Div Tertentu dalam Bootstrap?

Alih Keluar Ruang Longkang untuk Div ​​Tertentu Sahaja Tanpa Menggugat Responsif

Sistem grid Bootstrap biasanya termasuk ruang longkang lalai di antara lajur, mengakibatkan susun atur yang lebih menarik secara visual. Walau bagaimanapun, dalam senario tertentu, seseorang mungkin ingin mengalih keluar ruang longkang ini untuk div tertentu.

Penyelesaian Bootstrap 5:

Bootstrap 5 memperkenalkan kelas longkang khusus yang memberikan fleksibiliti dalam melaraskan jarak longkang di seluruh grid. Untuk mengalih keluar longkang bagi div tertentu, gunakan kelas g-0. Selain itu, anda boleh menggunakan kelas gx-* dan gy-* untuk menyesuaikan talang mendatar dan menegak masing-masing, mengekalkan tindak balas merentas pelbagai titik putus.

Penyelesaian Bootstrap 4:

Dalam Bootstrap 4, mencapai ini adalah mudah. Rangka kerja termasuk kelas tanpa selokan yang boleh digunakan pada baris tertentu, dengan berkesan mengalih keluar ruang longkang untuk semua lajur dalam baris itu.

Penyelesaian Bootstrap 3:

Untuk Bootstrap 3, pendekatannya berbeza sedikit. Disebabkan penggunaan padding dan bukannya margin untuk longkang, CSS berikut boleh digunakan pada div yang dikehendaki:

.no-gutter {
  margin-left: 0;
  margin-right: 0;
}

.no-gutter [class*='col-']:not(:first-child),
.no-gutter [class*='col-']:not(:last-child) {
  padding-right: 0;
  padding-left: 0;
}

Atas ialah kandungan terperinci Bagaimana untuk Mengeluarkan Ruang Longkang daripada Div Tertentu dalam Bootstrap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!