Heim >Web-Frontend >CSS-Tutorial >Wie kann ich eine Schaltfläche innerhalb eines Div zentrieren?
Zentrierte Schaltflächen innerhalb eines Divs erstellen
Das Zentrieren einer Schaltfläche innerhalb eines Divs kann durch verschiedene Methoden erreicht werden. Für ein Div mit einer Breite von 100 % können Sie dies wie folgt erreichen:
Flexbox verwenden (aktualisierte Antwort)
Flexbox bietet einen modernen und flexiblen Ansatz:
#wrapper { display: flex; align-items: center; justify-content: center; }
Dadurch wird die Schaltfläche sowohl vertikal als auch in der Mitte ausgerichtet horizontal.
Feste Breite und Positionierung verwenden (ursprüngliche Antwort)
Wenn die Schaltfläche eine feste Breite und Höhe hat, können Sie relative Positionierung und negative Ränder verwenden:
button { height: 20px; width: 100px; margin: -20px -50px; position: relative; top: 50%; left: 50%; }
Alternativ können Sie nur für die horizontale Ausrichtung margin: 0 auto; oder set text-align: center; auf der div.
Das obige ist der detaillierte Inhalt vonWie kann ich eine Schaltfläche innerhalb eines Div zentrieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!