Was genau ist Offset im Bootstrap?

Question

Ich verstehe, was Raster ist, im Grunde wird eine ganze Zeile 12 Leerzeichen haben.

<div class="row"> 
    <div class="col-md-4"> 
    </div> 

    <div class="col-md-4"> 
    </div> 

    <div class="col-md-4"> 
    </div> 
</div> 

Im Grunde, was oberhalb der Code Teilung ist nur die Räume in drei Abschnitt, aber was ich nicht verstehe ist, was ist der Punkt des Offset gerade?

<div class="col-lg-6 col-md-offset-3"> 

    </div> 

Was genau der Code oben tut?

Answer 1

Offsets werden für Abstandselemente im reagierenden Raster verwendet.

Die Einheit basiert auf dem Spaltenlayout.

Sie können einen Offset auf diese Weise definieren: COL- [Haltepunkt] -offset- [Anzahl der colums]

In diesem Beispiel Einlassen unser Layout 12 Säulen besteht:

<div class="row"> 
    <div class="col-md-6 col-md-offset-3"> 
     <p>test</p> 
    </div> 
</div> 

Bedeutet, dass im mittleren Bereich des Gridsystems, das Element eine Breite von 6 Spalten hat und es 3 leere Spalten geben wird, bevor das Element (und als Konsequenz, 3 leere Spalten nach haben wird).

Das Ergebnis davon ist ein div von 6 Spalten Breite, im Container zentriert.

Es gibt ein Beispiel, wie es in der Bootstrap-Dokumentation gerendert wird.

Answer 2

Offset bedeutet: Verschieben Sie die Spalten mit den Klassen .col-md-offset-* nach rechts. Diese Klassen erhöhen den linken Rand einer Spalte um * Spalten.

Zum Beispiel col-md-offset-3 erhöht den linken Rand um 3 für mittlere Geräte.