Heim > Web-Frontend > CSS-Tutorial > Wohin geht ein absolut positioniertes Element, wenn keine Offsets angegeben sind?

Wohin geht ein absolut positioniertes Element, wenn keine Offsets angegeben sind?

Mary-Kate Olsen
Freigeben: 2024-11-08 18:04:01
Original
348 Leute haben es durchsucht

Where Does an Absolutely Positioned Element Go When No Offsets Are Specified?

Position: Absolute Standardausrichtung

Bei Verwendung von position: absolute werden Elemente relativ zu ihrem enthaltenden Block positioniert. Wenn jedoch keine spezifischen Offsets angegeben werden, werden Standardwerte angewendet.

Wie sich herausstellt, ist der Standardwert für position: absolute nicht top: 0; links: 0, sondern eher auto. Gemäß der CSS-Spezifikation bleibt das Element in seiner „statischen Position“, wenn alle drei Offsets (oben, breit und rechts) auf „Auto“ eingestellt sind.

Statische Positionierung

Die statische Position bezieht sich auf die natürliche Position des Elements im Layout, als ob es nicht absolut positioniert wäre. Für ein absolut positioniertes Element bestimmt der enthaltende Block die Breite der statischen Position.

Horizontale Ausrichtung

Wenn links, Breite und rechts alle auf „Auto“ eingestellt sind, Die Breite des Elements ist „shrink-to-fit“. Das bedeutet, dass es die Breite erhält, die für die Aufnahme seines Inhalts erforderlich ist. Anschließend wird der linke Versatz berechnet, um sicherzustellen, dass das Element korrekt innerhalb des enthaltenden Blocks positioniert ist.

Vertikale Ausrichtung

Ähnliches gilt, wenn oben, Höhe und unten festgelegt sind Bei „Auto“ richtet sich die Höhe des Elements nach seinem Inhalt. Anschließend wird der obere Versatz berechnet, um die richtige Positionierung innerhalb des enthaltenden Blocks sicherzustellen.

Beispiel

Im bereitgestellten HTML-Code wird das h1-Element absolut ohne explizite Versätze positioniert :

h1 {
  position: absolute;
}
Nach dem Login kopieren

Standardmäßig bleibt das h1-Element an seiner statischen Position, die sich oben im enthaltenden Block befindet. Da der enthaltende Block in diesem Fall der ist, wird das h1-Element oben auf der Seite positioniert und am linken Rand ausgerichtet.

Fazit

Bei Verwendung von „position: absolut“ ohne angegebene Offsets wird die Standardpositionierung des Elements durch seinen enthaltenden Block und seinen Inhalt bestimmt, wodurch eine ordnungsgemäße Ausrichtung im Layout gewährleistet wird.

Das obige ist der detaillierte Inhalt vonWohin geht ein absolut positioniertes Element, wenn keine Offsets angegeben sind?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage