Wie drehe und positioniere ich ein Element in der oberen linken oder oberen rechten Ecke?

Ein Element in der oberen linken oder oberen rechten Ecke drehen und positionieren

So drehen Sie ein Div mit Text und platzieren es oben links Ecke kann der folgende Code verwendet werden:

.credit {
  transform-origin: top left;
  position: absolute;
  background-color: pink;
  transform: rotate(-90deg) translateX(-100%);
}

Hier wird die transform-origin-Eigenschaft auf „oben links“ festgelegt, wodurch die Drehung in Bezug auf die obere linke Ecke erfolgt. Die translatorX(-100 %)-Übersetzung verschiebt das gedrehte Element um 100 % seiner Breite nach links.

Um das Element am rechten Rand auszurichten, können Sie den translatorX-Wert so ändern, dass er positiv ist, z. B. translatorX (100 %). Dadurch wird das gedrehte Element um 100 % seiner Breite nach rechts verschoben.

.credit {
  transform-origin: top right;
  position: absolute;
  background-color: pink;
  transform: rotate(-90deg) translateX(100%);
}

Das obige ist der detaillierte Inhalt vonWie drehe und positioniere ich ein Element in der oberen linken oder oberen rechten Ecke?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!