CSS verwendet Position + Rand, um die Methode der horizontalen und vertikalen Zentrierung fester Boxen zu erreichen
|
Rand: automatisch; + Position: absolut; oben, unten, links und rechts: 0
<!DOCTYPE html>
<html>
<Kopf>
<meta http-equiv="Inhaltstyp" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta name="viewport" content="Anfangsmaßstab=1,0, Maximalmaßstab=1,0, benutzerdefiniert skalierbar=nein" />
<title>Verwenden Sie Position + Rand, um die Box horizontal und vertikal zu fixieren</title>
<Stil>
Körper * {
Umriss: 1px #ff0000 durchgezogen;
}
.Vater {
Breite: 500px;
Höhe: 300px;
Position: relativ;
}
.Vater .Sohn {
Breite: 180px;
Höhe: 140px;
/* */
Position: absolut;
rechts: 0;
unten: 0;
oben: 0;
links: 0;
Rand: automatisch;
}
</Stil>
</Kopf>
<Text>
<div Klasse="Vater">
<div class="son">margin:auto + hoch, runter, links und rechts:0</div>
</div>
</body>
</html>//Ende Dies ist das Ende dieses Artikels über die Verwendung von Position + Rand in CSS, um eine horizontale und vertikale Zentrierung einer festen Box zu erreichen. Weitere relevante Inhalte zur horizontalen und vertikalen Zentrierung einer festen Box in CSS finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird! |
<<: Docker stellt Mysql, .Net6, Sqlserver und andere Container bereit
>>: Sublime Text - Empfohlene Methode zum Festlegen von Browser-Tastenkombinationen
Artikel empfehlen
MySQL-Datenbank zum Abrufen der Angaben zu Sekunden, Minuten, Stunden und Tagen vor und nach
Aktuelle Uhrzeit abrufen: Wählen Sie aktuellen Ze...
Detaillierte Erläuterung der passwortfreien SSH-Anmeldekonfigurationsmethode (Bilder und Befehle)
Lassen Sie mich zunächst erklären, dass wir uns o...
So berechnen Sie den Wert von ken_len im MySQL-Abfrageplan
Die Bedeutung von key_len In MySQL können Sie „ex...
CSS3 verwendet scale() und rotate() zum Zoomen und Drehen
1. scale()-Methode Zoom steht für „Verkleinern“ u...
Detaillierter Prozess und häufige Probleme bei der VMware15-Installation von CentOS7 (Bild und Text)
1. Vorbereitung des Installationspakets VMware-pl...
Installieren Sie die MySQL5.5-Datenbank in einer CentOS7-Umgebung
Inhaltsverzeichnis 1. Prüfen Sie, ob MySQL auf de...
Detailliertes Tutorial zur Installation von Centos8 auf VMware
Offizielle Website-Adresse von CentOS https://www...
Methode zur Erstellung von Vue-Scaffolding-Lernprojekten
1. Was ist Scaffolding? 1. Vue-CLI Vue CLI ist ei...
React Native JSI implementiert Beispielcode für RN und native Kommunikation
Inhaltsverzeichnis Was ist JSI Was ist anders an ...
Ein Bugfix für Tomcats automatisches Herunterfahren
Vorwort Bei einem seit 4 Jahren laufenden Java EE...
Farbverlauf für HTML-Hintergrund durch CSS erreicht
Screenshots der Effekte: Implementierungscode: Cod...
Ein MySQL-Migrationsplan und eine praktische Auflistung der Fallstricke
Inhaltsverzeichnis Hintergrund Lösung 1: Alte Dat...
Beheben Sie das Problem, dass die MySQL-Datenbank unerwartet abstürzt, wodurch die Tabellendatendatei beschädigt wird und nicht gestartet werden kann
Problem: Die MySQL-Datenbank ist unerwartet abges...
Tutorial zu HTML-Tabellen-Tags (12): Rahmenstil-Attribut FRAME
Verwenden Sie die FRAME-Eigenschaft, um den Stilt...
So verwenden Sie video.js in Vue zum Abspielen von Videos im M3U8-Format
Inhaltsverzeichnis 1. Installation 2. Einführung ...