Im Allgemeinen wird das Layout des Hauptinhalts von Webseiten im Browser zentriert. Beispielsweise hat die Hauptseite der chinesischen PHP-Website ein zentriertes Layout.
Wie verwende ich CSS, um das gesamte Webseitenlayout zu zentrieren? Was sind die Voraussetzungen für die Layoutzentrierung?
Zuerst müssen wir den CSS-Inhaltszentrierungsstil (css text-align:center) für den Text festlegen und dann margin:0 auto verwenden, wenn wir das äußerste DIV anordnen Das Objektlayout ist zentriert.
Natürlich verwenden wir margin:0 auto für das Box-Objekt. Einige Browser fügen dem Body-Objekt nicht den Stil text-align:center hinzu, und das Layout ist immer noch zentriert Verschiedene Browser sind unterschiedlich. Wenn Sie text-align:center nicht auf den Text festlegen, werden einige Browser-Layouts zentriert und andere auf der linken Seite.
Erklärung: Rand: 0 automatisch, was bedeutet, dass der obere und untere Abstand des Objekts 0 beträgt, der linke und rechte Abstand automatisch erfolgt und der linke und rechte Abstand automatisch entsprechend der Breite des Objekts erfolgt .
Zentrierungsbedingung für das Webseitenlayout
1. Legen Sie den CSS-Inhaltszentrierungsstil text-align:center für den Text fest: body{text-align:center }
2. Legen Sie den margin:0 auto-Stil für das äußerste Objekt fest, Code: .php{margin:0 auto🎜>
Fall:
Um den Layout-Zentrierungseffekt zu beobachten, lautet unser CSS-benanntes Objekt „.php“ und stellt den CSS-Rand auf Schwarz, die CSS-Breite auf 400 Pixel und die CSS-Höhe auf 100 Pixel ein. 1. Der CSS-Code lautet wie folgt: 2. HTML-Code-Snippet:Das obige ist der detaillierte Inhalt vonSo zentrieren Sie das Ganze in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
