Heim > Web-Frontend > CSS-Tutorial > Wie entferne ich Abstand und Rand aus Bootstrap 3-Spalten?

Wie entferne ich Abstand und Rand aus Bootstrap 3-Spalten?

DDD
Freigeben: 2024-12-15 19:02:10
Original
618 Leute haben es durchsucht

How to Remove Padding and Margin from Bootstrap 3 Columns?

So entfernen Sie den Abstand aus Bootstrap 3-Spalten

In Bootstrap 3 werden durch die Verwendung von col-md-*-Klassen rechts Abstand und Rand hinzugefügt und links von den Spalten. Um diesen Abstand und Rand zu entfernen, führen Sie die folgenden Schritte aus:

Verwenden Sie .row anstelle von .col-md-12

Verpacken Sie Ihre Spalten stattdessen in einen .row-Container ein .col-md-12-Container. .row verfügt nicht über die zusätzlichen Ränder und Abstände wie .col-md-12.

<div class="container">
    <div class="row">
        <div class="col-md-4">...</div>
        <div class="col-md-8">...</div>
    </div>
</div>
Nach dem Login kopieren

Fügen Sie eine benutzerdefinierte Klasse hinzu, um Abstand und Abstände zu entfernen

If Wenn Sie die Auffüllung und den Rand nur für bestimmte Spalten entfernen möchten, fügen Sie diesen Spalten eine benutzerdefinierte Klasse hinzu.

<div class="container">
    <div class="row">
        <div class="col-md-4 nopadding">...</div>
        <div class="col-md-8 nopadding">...</div>
    </div>
</div>

.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonWie entferne ich Abstand und Rand aus Bootstrap 3-Spalten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage