Wie erreicht man eine responsive Fußzeilenausrichtung in Twitter Bootstrap?

Responsive Fußzeilenausrichtung mit Twitter Bootstrap

In diesem Artikel untersuchen wir ein Problem, mit dem Benutzer konfrontiert sind, die versuchen, ihre Fußzeilen am unteren Rand auszurichten die Seite mithilfe von CSS-Techniken im Kontext von Twitter Bootstrap, einem beliebten responsiven Framework.

Das Problem entsteht durch Twitter Bootstrap verwendet ein responsives Design, was es schwierig macht, mit herkömmlichen CSS-Methoden die gewünschte Fußzeilenausrichtung zu erreichen. Um dieses Problem anzugehen, untersuchen wir mögliche Lösungen:

Bootstrap 2.2.1 und höher

Mit Bootstrap 2.2.1 oder höher wird diese Funktionalität jetzt nativ unterstützt.

Bootstrap 3.x

In Bootstrap 3.x, verwenden Sie die Navbar-Komponente zusammen mit der Klasse .navbar-fixed-bottom:

<div class="navbar navbar-fixed-bottom"></div>

Bootstrap 4.x

Für Bootstrap 4.x , verwenden Sie den folgenden Code:

<div class="navbar fixed-bottom"></div>

Zusätzlich Hinweis

Denken Sie daran, auch das folgende CSS hinzuzufügen, um zu verhindern, dass der Seiteninhalt abgedeckt wird:

body { padding-bottom: 70px; }

Eine ausführlichere Dokumentation finden Sie auf der offiziellen Bootstrap-Website: http:/ /getbootstrap.com/components/#navbar-fixed-bottom

Das obige ist der detaillierte Inhalt vonWie erreicht man eine responsive Fußzeilenausrichtung in Twitter Bootstrap?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!