Heim >Web-Frontend >CSS-Tutorial >Führen Sie eine Animation mit der maximalen CSS-Breite durch
Führen Sie eine Animation mit der maximalen CSS-Breite durch
- WBOYnach vorne
- 2023-08-26 20:09:06886Durchsuche
Um die Max-Width-Eigenschaft mithilfe von CSS zu animieren, können Sie versuchen, den folgenden Code auszuführen
Beispiel
Live-Demo
<!DOCTYPE html>
<html>
<head>
<style>
div {
overflow: auto;
background-color: blue;
color: white;
border: 1px solid black;
animation: myanim 3s;
}
@keyframes myanim {
30% {
max-width: 250px;
}
}
</style>
</head>
<body>
<h1>Example of max-width</h1>
<div>
<p>This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text.
This is demo text. This is demo text. This is demo text.
</p>
</div>
</body>
</html>Das obige ist der detaillierte Inhalt vonFühren Sie eine Animation mit der maximalen CSS-Breite durch. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Stellungnahme：
Dieser Artikel ist reproduziert unter:tutorialspoint.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen
Vorheriger Artikel：Welche Farbkanalfunktionen gibt es in Less?Nächster Artikel：Welche Farbkanalfunktionen gibt es in Less?