Wie kann ich in Bootstrap Abstände zwischen Spalten hinzufügen?

Abstände zwischen Spalten in Bootstrap hinzufügen

Wenn Sie mit dem Rastersystem von Bootstrap arbeiten, müssen Sie möglicherweise Abstände zwischen Spalten hinzufügen. Standardmäßig werden die Spalten direkt nebeneinander platziert. Mit einer einfachen Bootstrap-Lösung können Sie jedoch problemlos Abstände zwischen Spalten erreichen.

Verschachtelte Spalten

Um Abstände zwischen Spalten zu erstellen, können Sie jede Spalte in eine verschachtelte Spalte einschließen . Betrachten Sie zum Beispiel den folgenden Code:

<div class="row">
  <div class="col-md-6">
    <div class="col-md-12">
      Column 1 content
    </div>
  </div>
  <div class="col-md-6">
    <div class="col-md-12">
      Column 2 content
    </div>
  </div>
</div>

Ändern der Größe der inneren Spalten

Indem Bootstrap die Spalten auf diese Weise umschließt, weist Bootstrap automatisch etwa 10 Pixel Abstand zu links und rechts der inneren Säulen. Dadurch entsteht ein sichtbarer Abstand zwischen den äußeren Spalten.

Anpassen des Abstands

Um den Abstand zwischen den Spalten anzupassen, können Sie die Breite der inneren angeben Spalten. Wenn Sie beispielsweise einen 100-Pixel-Bereich wünschen, ändern Sie die inneren Spalten wie folgt:

<div class="col-md-12">

Fazit

Mit der Technik der verschachtelten Spalten ist das Hinzufügen einfach Abstand zwischen Spalten in Bootstrap. Dies kann besonders nützlich sein, wenn Sie bestimmte Elemente hervorheben oder ein optisch ansprechenderes Layout erstellen möchten.

Das obige ist der detaillierte Inhalt vonWie kann ich in Bootstrap Abstände zwischen Spalten hinzufügen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!