Können Sie Elemente absolut ohne explizite Werte für oben, links, unten und rechts positionieren?

Elemente völlig ohne explizite Werte für oben/links/unten/rechts positionieren: Ein Einblick in den Standard

Im Bereich der Webentwicklung Durch die absolute Positionierung können Elemente unabhängig von ihrem normalen Fluss im Dokument platziert werden. Es stellt sich jedoch eine häufige Frage, wenn versucht wird, dies zu erreichen, ohne die Eigenschaften oben/links/unten/rechts explizit festzulegen.

Standardverhalten für automatische Werte

Gemäß der Gemäß der CSS2-Spezifikation besteht das Standardverhalten für automatische Werte in den Eigenschaften oben/unten, links/rechts darin, ihnen dieselben Werte zuzuweisen, die sie an der statischen Position hätten. Das bedeutet, dass sich ein Element mit Position: absolut und allen vier Auto-Werten so verhält, als ob es statisch positioniert wäre.

Fall Nr. 1: Logo über dem Foto im WordPress-Header

Im ersten Fall ist die Positionierung des Logos absolut über dem Foto ohne explizite Werte für oben/links/unten/rechts möglich, da das Logo-Element das erste untergeordnete Element seines übergeordneten Containers (Header) ist. Wie der CSS-Standard besagt, wird ein absolut positioniertes erstes untergeordnetes Element mit Rändern (oder Abstand) im Verhältnis zur oberen linken Ecke seines übergeordneten Elements verschoben.

Fall Nr. 2: Horizontales Menü mit mehreren Ebenen

Im zweiten Fall kann das horizontale mehrstufige Menü mit display:table-* angeordnet werden, Tabellenzellen unterstützen jedoch keine relative Positionierung. Wenn Sie jedoch „position: absolute“ für die Menüelemente verwenden und die Eigenschaften „oben/unten“, „links/rechts“ auf „Auto“ belassen, stellt das Standardverhalten sicher, dass diese Elemente gemäß ihren statischen Positionswerten positioniert werden, wodurch effektiv eine relative Positionierung innerhalb der Tabellenzelle emuliert wird Kontext.

Browserkompatibilität

Während diese Technik der CSS2-Spezifikation entspricht und theoretisch funktionieren sollte, ist es wichtig zu beachten, dass der Browser absolute Positionierung ohne explizite Top-Positionierung unterstützt /left/bottom/right-Werte können variieren. Bei einigen älteren Browsern wie Firefox 0.8 und IE6-7 kann es zu unerwartetem Verhalten kommen. Dennoch bleibt es ein gültiger Ansatz, der in bestimmten Situationen Flexibilität bieten kann.

Das obige ist der detaillierte Inhalt vonKönnen Sie Elemente absolut ohne explizite Werte für oben, links, unten und rechts positionieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!