Was sind die CSS-Positionierungsmethoden?

Es gibt 5 Arten von CSS-Positionierungsmethoden: 1. Floating-Positionierung (Float). 2. statisch (statische Positionierung); ohne Positionierung erscheint das Element im normalen Fluss. 3. Relativ (relative Positionierung); das Element wird vom normalen Dokumentenfluss getrennt. 4. Absolut (absolute Positionierung). 5. fest (feste Positionierung).

Die Betriebsumgebung dieses Tutorials: Windows 7-System, CSS3-Version, Dell G3-Computer.

Komplexe Webseitenlayouts werden durch flexible Positionierung verschiedener Webseitenelemente realisiert. Die Positionierung verschiedener Elemente auf der Webseite hat ihre eigenen Eigenschaften. Werfen wir einen Blick auf verschiedene Positionierungsmethoden von CSS.

Float-Positionierung (d. h. schwebende Positionierung):

Diese Positionierungsmethode ist sehr einfach. Sie müssen nur eine schwebende Richtung angeben (z. B. float:left; bedeutet, dass dieses Element links platziert wird). Die Positionierung erfolgt relativ im übergeordneten Elementcontainer.

Wenn das Element auf Float eingestellt ist, werden die Elemente unmittelbar dahinter vom Float beeinflusst. Wenn die nachfolgenden Elemente nicht betroffen sind, müssen die Floats daher später gelöscht werden. beides; und andere Methoden können verwendet werden) Wenn zwei benachbarte Elemente auf denselben Float gesetzt sind, werden die beiden Elemente der Reihe nach nebeneinander platziert. Durch diese Positionierung wird das Element aus dem Dokumentenfluss entfernt.

Positionspositionierung:

Positionspositionierung ist die Positionierung an einem bestimmten Ort. Die folgenden werden häufig verwendet:

1. Statisch (statische Positionierung):

Wenn wir keine Positionierungsmethode angeben, ist die Standardpositionierungsmethode Statisch, das heißt, es wird automatisch an einer geeigneten Stelle entsprechend dem Schreiblayout des Dokuments zugewiesen. Diese Positionierungsmethode verwendet den Rand, um die Position zu ändern, und ist für diese Positionierung ungültig bricht nicht vom Dokumentenfluss ab;

Diese Positionierung ist eine relative Positionierung. Sie können die linken, oberen und anderen Werte festlegen, um das angegebene Element relativ zu seiner normalen Position zu verschieben bricht nicht aus dem Dokumentenfluss ab;

3. Absolute Positionierung (absolute Positionierung):

Diese Positionierung erfolgt anders als die statische Positionierung durch Festlegen der Versatzwerte von oben, rechts, unten und links (diese Positionierung legt normalerweise das übergeordnete Element fest) Wird in Verbindung mit der relativen Positionierung verwendet. Wenn kein übergeordnetes Element vorhanden ist, ist seine Referenz der Körper, der sich außerhalb des Dokumentflusses befindet

4. :

Diese Positionierungsmethode bezieht sich auf das gesamte Dokument. Legen Sie einfach den Versatzwert relativ zu jeder Richtung fest. Sie können das Element an einer festen Position auf der Seite fixieren. Dies wird normalerweise verwendet, um einige Eingabeaufforderungsinformationen anzuzeigen und den Dokumentfluss zu unterbrechen ;

(Lernvideo-Sharing:

CSS-Video-Tutorial

)

Das obige ist der detaillierte Inhalt vonWas sind die CSS-Positionierungsmethoden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!