search

Home >Web Front-end >CSS Tutorial >Animating CSS height properties

Animating CSS height properties

WBOY
WBOYforward
2023-09-15 23:05:071241browse

动画 CSS 高度属性

To animate on the height property using CSS, you can try running the following code

Example

Live demonstration

<!DOCTYPE html>
<html>
   <head>
      <style>
         div {
            border: 2px solid black;
            width: 300px;
            height: 100px;
            animation: myanim 5s infinite;
         }
         @keyframes myanim {
            30% {
               height: 400px;
            }
         }
      </style>
   </head>
   <body>
      <div>This is demo text</div>
   </body>
</html>

The above is the detailed content of Animating CSS height properties. For more information, please follow other related articles on the PHP Chinese website!

css
Statement：
This article is reproduced at:tutorialspoint.com. If there is any infringement, please contact admin@php.cn delete
Previous article：Sets how many seconds or milliseconds a CSS transition effect takes to completeNext article：Sets how many seconds or milliseconds a CSS transition effect takes to complete

Related articles

See more