Heim > Web-Frontend > CSS-Tutorial > Wie kann ich ein Div mithilfe von CSS einfach horizontal zentrieren?

Wie kann ich ein Div mithilfe von CSS einfach horizontal zentrieren?

Susan Sarandon
Freigeben: 2024-12-23 21:46:10
Original
136 Leute haben es durchsucht

How Can I Easily Center a Div Horizontally Using CSS?

Mühelose horizontale Zentrierung von <div> Elemente mit CSS

Zentrieren eines <div> Element auf einer Webseite unter Beibehaltung einer Mindestbreite kann mit CSS problemlos erreicht werden. Um dies zu erreichen:

Für nicht feste Breite <div> Elemente:

Wenn Sie den genauen Platz nicht kennen, wird <div> belegen möchten, befolgen Sie diese Schritte:

  1. Erstellen Sie einen Wrapper-Container (#wrapper) mit einer angegebenen Breite und richten Sie den Text darin manuell aus (d. h. text-align: center;).
  2. Stellen Sie das <div> inline zentriert werden mit display: inline-block;.
#wrapper {
  background-color: green; /* for visualization */
  text-align: center;
}
#yourdiv {
  background-color: red; /* for visualization */
  display: inline-block;
}
Nach dem Login kopieren
<div>
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonWie kann ich ein Div mithilfe von CSS einfach horizontal zentrieren?. 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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage