Welche Attribute können in CSS3 einen Schwenkeffekt erzielen?-CSS-Tutorial-php.cn

Welche Attribute können in CSS3 einen Schwenkeffekt erzielen?

WBOY

Freigeben： 2021-12-15 10:07:58

Original

4003 Leute haben es durchsucht

Das Attribut, das den Übersetzungseffekt in CSS3 erzielen kann, ist „transformieren“. Das Transformationsattribut kann mit der Funktion Translate() verwendet werden, um Übersetzungsoperationen für Elemente durchzuführen. Die Syntax lautet „element {transform:translate(horizontaler Übersetzungswert, vertikaler Übersetzungswert);}“.

Welche Attribute können in CSS3 einen Schwenkeffekt erzielen?

Die Betriebsumgebung dieses Tutorials: Windows 10-System, CSS3- und HTML5-Version, Dell G3-Computer.

Welche Attribute können den Übersetzungseffekt in CSS3 erzielen?

In CSS3 können Sie das Transformationsattribut mit der Funktion Translate () verwenden, um den Elementübersetzungseffekt zu erzielen. Das Attribut

transform wendet eine 2D- oder 3D-Transformation auf ein Element an. Mit dieser Eigenschaft können wir das Element drehen, skalieren, verschieben oder neigen. Die Funktion

translate() wird verwendet, um die 2D-Transformation von Elementen zu definieren. Das ist der Effekt der Übersetzung.

Die Syntax lautet wie folgt:

元素{transform:translate(横向平移值,竖向平移值);}

Nach dem Login kopieren

Das Beispiel lautet wie folgt:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <style>
  div{
    width:100px;
    height:100px;
    border:1px solid #000;
    transform:translate(100px,100px);
  }
  </style>
</head>
<body>
  <div></div>
</body>
</html>

Nach dem Login kopieren

Ausgabeergebnis:

Wenn der Transformationsstil:translate(100px,100px); nicht hinzugefügt wird

Welche Attribute können in CSS3 einen Schwenkeffekt erzielen?

Fügen Sie die Transformation hinzu: Translate(100px,100px); Style After:

Welche Attribute können in CSS3 einen Schwenkeffekt erzielen?

(Lernvideo-Sharing: CSS-Video-Tutorial)

Das obige ist der detaillierte Inhalt vonWelche Attribute können in CSS3 einen Schwenkeffekt erzielen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!