Worauf sollten Sie beim Zentrieren eines Div in HTML achten?

Viele Menschen haben solche Zweifel. Wenn wir eine Webseite gestalten, befindet sich der Hauptrahmen der Webseite normalerweise in der Mitte des Browsers. Wenn Sie also eine horizontale Zentrierung des äußersten DIV erreichen möchten, müssen Sie diese unbedingt separat festlegen. Worauf sollten Sie achten, wenn Sie ein Div so einstellen, dass es zentriert ist? Lassen Sie mich es Ihnen heute vorstellen.

Wenn das CSS des äußersten DIV-Felds „#divcss5“ heißt, wird das äußerste Feld zentriert, um mit den gängigen Browsern kompatibel zu sein.

Erste Bedingung:

Zu diesem Zeitpunkt legen Sie den CSS-Inhaltszentrierungsstil (text-align:center) für „body“ fest

Das heißt, der CSS-Code:

body{text-align:center}

Erste Einstellung:

Stellen Sie zu diesem Zeitpunkt den erforderlichen CSS-Rand im Zentrierstil für „#divcss5“ ein

Das heißt, der CSS-Code:

#divcss5{margin:0 auto}

DIV-Center-Verwendungsbeispiel

Um den Layout-Zentrierungseffekt leicht zu beobachten, fügen wir „#divcss5“ einen CSS-Rahmen mit einem schwarzen Rand, einer CSS-Breite von 300 Pixel und einer Höhe von hinzu 100px.

1. Holen Sie sich endlich den CSS-Code für die DIV-Zentrierung:

body{ text-align:center} 
#divcss5{margin:0 auto;border:1px solid #000;width:300px;height:100px}

2. Entsprechender HTML-Codeausschnitt:

<div id="divcss5">DIV水平居中案例</div>

Es gibt so viele Dinge, die Sie tun müssen Achten Sie beim Zentrieren eines Div darauf, weitere spannende Inhalte zu erhalten. Beachten Sie bitte andere verwandte Artikel auf der chinesischen PHP-Website!

Verwandte Empfehlungen:

So verwenden Sie das 1aa9e5d373740b65a0cc8f0a02150c53-Tag von HTML

So schreiben Sie die HTML-Dokumenttypdeklaration

So zeigen Sie kreisförmige Bilder in CSS3 an

Das obige ist der detaillierte Inhalt vonWorauf sollten Sie beim Zentrieren eines Div in HTML achten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!