Einige Kenntnisse über die absolute und relative Positionierung von Seitenelementen
|
Ab heute werde ich regelmäßig kleine Wissenspunkte organisieren. Einige davon sind vielleicht sehr einfach, aber sie sollten alle nützlich sein. In Bezug auf die absolute und relative Positionierung von div ist dies etwas, das jedes Front-End-IT-Personal verwenden wird. Die sogenannte absolute Positionierung bedeutet, dass dieses Ding einfach da ist und meine Position unverändert bleibt, egal wie sich andere Dinge bewegen. Um es nett auszudrücken, nennt man das Integrität, aber um es unverblümt auszudrücken, nennt man es Schurkerei. Natürlich wird für die relative Positionierung im Allgemeinen die absolute Positionierung verwendet. Das ist vergleichbar mit einer Bande, die Schutzgelder eintreibt. Dieser Bereich unterliegt meiner Gerichtsbarkeit, daher gelten die Positionen der Elemente in mir ausschließlich für mich und haben nichts mit der Außenwelt zu tun. Nachdem wir über die absolute Positionierung gesprochen haben, sprechen wir über die relative Positionierung. Elemente mit diesem Attribut sind sehr charakterlos. Ich gehe dorthin, wohin der Anführer geht, und drehe mich immer um den Anführer. So, genug geredet, kommen wir zurück zum Thema. Manchmal müssen wir einer Ebene etwas hinzufügen, aber das ist in einer Webseite nicht so einfach wie in PS. Wir müssen ein Div (oder einen anderen Container) schreiben, um den Inhalt unserer Ebene zu speichern, es dann in die Ebene (Div) einfügen, wo wir es platzieren möchten, die Position im Stilattribut unserer übergeordneten Ebene auf absolut setzen und schließlich die Position des Stils unseres neu erstellten Div auf relativ setzen. Auf diese Weise wird meine Ebene über der übergeordneten Ebene platziert. Die Unterebene verfügt über die Eigenschaften oben, unten, links und rechts und wir können unsere Elemente nach oben, unten, links und rechts positionieren. Beachten Sie, dass Ihre relative Positionierung relativ zur gesamten Seite ist, wenn Sie keine Ebene für die absolute Positionierung definieren. Axure RP, eine häufig verwendete Prototyping-Software, verwendet eine globale relative Positionierung. Tatsächlich ist Axure RP sehr einfach zu verwenden. Das Wetter wird kühler, also halten Sie sich bitte warm. |
>>: Dieser Artikel zeigt Ihnen, wie Sie mit CSS-Kombinationsselektoren spielen
Artikel empfehlen
JavaScript-Singleton-Modus zum Implementieren benutzerdefinierter Popup-Fenster
In diesem Artikel wird der spezifische Code des J...
Zusammenfassung der grundlegenden Kenntnisse zur MySql-Datenbank
Inhaltsverzeichnis Grundlegende Datenbankvorgänge...
Grafisches Tutorial zur Installations- und Konfigurationsmethode für die Dekomprimierungsversion von mysql5.7.14 (Win10)
Win10 installiert die dekomprimierte Version von ...
Die häufigste Deklarationszusammenführung in TS (Schnittstellenzusammenführung)
Inhaltsverzeichnis 1. Schnittstelle zusammenführe...
Beispiel für eine automatische Importmethode für allgemeine Vue3.0-Komponenten
1. Voraussetzungen Wir verwenden zum Importieren ...
So verwalten Sie zwischengespeicherte Seiten in Vue
Inhaltsverzeichnis Problem 1: Zerstörung 1. Wie m...
Grundlegende Verwendung von @Font-face und wie man es mit allen Browsern kompatibel macht
@Font-face grundlegende Einführung: @font-face ist...
Detaillierte Erklärung der Verwendung und des Unterschieds zwischen nohup und & in Linux
Beispiel: Wir verwenden den Python-Code loop_hell...
So stellen Sie mit Navicat Premium eine Remoteverbindung zur MySQL-Datenbank her
Derjenige, der eine neue Verbindung herstellt, en...
Zusammenfassung einiger gängiger Methoden von JavaScript-Arrays
Inhaltsverzeichnis 1. Einleitung 2. filter() 3. K...
Was bedeutet das „a“ in rgba? CSS RGBA-Farbleitfaden
RGBA ist eine CSS-Farbe, mit der Farbwert und Tra...
CentOS7.5-Installationstutorial für MySQL
1. Überprüfen Sie zunächst, ob auf dem System MyS...
Lösung für das Problem, dass der Text unten links steht und bei der Gestaltung des Textbereichs nicht in der Größe geändert werden kann
Zwei kleine Probleme, die mich aber lange Zeit ges...
So installieren Sie OpenJDK in Docker und führen das JAR-Paket aus
Bild herunterladen Docker-Pull OpenJDK Erstellen ...
JavaScript-Verlaufsobjekt erklärt
Inhaltsverzeichnis 1. Routennavigation 2. API zur...