Warum schnappen meine CSS-transformierten Elemente zurück, anstatt an Ort und Stelle zu bleiben?

Warum schnappt ein Element nach einer Transformation zurück, anstatt an Ort und Stelle zu bleiben?

Beim Versuch, ein Element danach in seiner transformierten Position zu halten Bei einem Übergang kann es passieren, dass das Element unerwartet an seine ursprüngliche Stelle zurückschnappt. Dieses Problem tritt häufig aufgrund inkompatibler Anzeigeeinstellungen für CSS-Transformationen auf.

Ursache

CSS-Transformationen funktionieren im Allgemeinen nicht ordnungsgemäß mit Elementen, die über die Einstellung „display: inline“ verfügen. Obwohl die anfängliche Transformation scheinbar wirksam wird, führt die Inline-Einstellung dazu, dass das Element an seine vorherige Position zurückkehrt.

Lösung

Um dieses Problem zu beheben, ändern Sie die Anzeigeeinstellung anzuzeigen: inline-block, wie im folgenden CSS-Auszug zu sehen:

.blockquote {
  display: inline-block;
  ...
}

Durch den Wechsel zu inline-block ermöglichen Sie, dass CSS-Transformationen erfolgreich auf das Element einwirken und verhindern, dass es zurückschnappt und es behält in seiner geänderten Position nach dem Übergang.

Das obige ist der detaillierte Inhalt vonWarum schnappen meine CSS-transformierten Elemente zurück, anstatt an Ort und Stelle zu bleiben?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!