Heim >Web-Frontend >CSS-Tutorial >Häufig verwendete Methoden zur horizontalen Zentrierung von CSS-Layout-Webseiten_Erfahrungsaustausch
Häufig verwendete Methoden zur horizontalen Zentrierung von CSS-Layout-Webseiten_Erfahrungsaustausch
- PHP中文网Original
- 2016-05-16 12:06:341536Durchsuche
Die horizontale Zentrierung der Seite bereitet im Allgemeinen Kopfschmerzen, insbesondere für Anfänger. Auch Inkompatibilitäten zwischen Browsern können zu großen Problemen führen. Lassen Sie uns über gängige Methoden sprechen, um die Seite horizontal zu zentrieren.
Die folgenden Inhalte finden Sie unter „CSS beherrschen“.
HTML-Code:
Der Code lautet wie folgt
<body>
<div id="wrapper">
</div>
</body>
IE居中办法：
body {
text-align:center;
min-width:760px;
}
#wrapper {
width:720px;
text-align:left;
}IE verwechselt text-align:center damit, alles zu zentrieren, nicht nur den Text. Anschließend den Inhalt des Behälters nach links neu ausrichten.
Nicht-IE:
Der Code lautet wie folgt:
#wrapper {
width:720px;
margin:0 auto;
}
Wie mache ich ihn mit IE und Nicht-IE kompatibel? 🎜>
#wrapper {
width:720px;
position:relative;
left:50%;
margin-left:-360px;
}Positionieren Sie zuerst den linken Rand des Containers in der Mitte der Seite und verschieben Sie ihn dann um die halbe Breite nach links .