Heim >Web-Frontend >CSS-Tutorial >Relative Positionierung mit CSS
Relative Positionierung mit CSS
- PHPznach vorne
- 2023-08-27 15:13:021307Durchsuche
Relative Positionierung ändert die Position eines HTML-Elements relativ zu seiner normalen Anzeigeposition. „left:20“ fügt also 20 Pixel zur LINKEN Position des Elements hinzu.
Sie können die beiden Werte top und left zusammen mit dem attribute verwenden, um das HTML-Element an eine beliebige Position im HTML-Dokument zu verschieben.
- Nach links verschieben – Verwenden Sie negative Werte für nach links.
- Nach rechts bewegen – Positive Werte für links verwenden.
- Nach oben verschieben -Negative Werte für die Spitze verwenden.
- Nach unten bewegen – Verwenden Sie oben positive Werte.
Beispiel
Sie können versuchen, den folgenden Code auszuführen, um eine relative Positionierung zu erreichen -
<html>
<head>
</head>
<body>
<div style = "position:relative;left:80px;top:2px;background-color:yellow;">
This div has relative positioning.
</div>
</body>
</html>Das obige ist der detaillierte Inhalt vonRelative Positionierung mit CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Stellungnahme：
Dieser Artikel ist reproduziert unter:tutorialspoint.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen
Vorheriger Artikel：Wie lege ich die Basisposition eines gedrehten Elements in CSS fest?Nächster Artikel：Wie lege ich die Basisposition eines gedrehten Elements in CSS fest?