Über das Problem der CSS-Steuerung der horizontalen DIV-Zentrierung

Autor：Eve Cole Aktualisierungszeit：2009-05-31 01:02:34

Was die Frage der CSS-Steuerung der horizontalen Zentrierung von DIVs angeht, sehe ich, dass viele Neulinge verwirrt sind. Ich erinnere mich an das erste Mal, als ich CSS las, ein von einem Ausländer geschriebenes Buch, in dem es um die Verwendung von Zentrierung ging.

margin-left:auto;
margin-right:auto;

Tatsächlich entspricht es:

Rand:0 automatisch;

Sie können diese Methode also verwenden, aber einige Leute haben festgestellt, dass sie bei Verwendung des IE nicht zentriert ist. Es wird empfohlen, dass Sie überprüfen, ob eine DTD-Deklaration fehlt.

Viele Menschen haben ähnliche Fehler gemacht! Man kann auch von dieser Methode sprechen, dass sie sich bewährt hat, aber in einigen Fällen funktioniert sie immer noch nicht. Es gibt also eine zweite Methode.

Rand links: 50 %;
links: -width/2;

Die Breite hier ist nicht die Breite in CSS, sondern die Breite Ihres DIV. Wenn Ihr Div beispielsweise 768 Pixel breit ist, sollten Sie left:-384px festlegen. Sehr gut, es gibt bereits zwei Methoden, von denen man sagen kann, dass sie die Probleme gelöst haben, auf die Sie möglicherweise stoßen.

Manchmal werden Sie feststellen, dass diese beiden nicht ausreichen. Nicht kompatibel mit einigen Browsern. Deshalb habe ich eine dritte Methode gefunden, die hauptsächlich den IE berücksichtigt und auf der ersten Methode basiert. Es erfordert die Einstellung des Körpers.

Körper {text-align: center;}

Auf diese Weise wird es auch im IE zentriert, es entsteht jedoch ein neues Problem. Sie stellen fest, dass der gesamte Text auf Ihrer Seite zentriert ist, was nicht gut aussieht. Dies lässt sich leicht lösen. Fügen Sie einfach text-align: left; und andere Anpassungseinstellungen zu Ihrer DIV-Definition hinzu.

Der obige Text ist nur eine Referenz und Skizze nach dem Abendessen. Jeder kann bei der eigentlichen Arbeit darauf achten!