首页
课程
路径
文章
PHP培训
精品课
下载

技术文章  >  web前端 > css教程

在 CSS max-width 上执行动画

WBOY
WBOY 转载
2023-08-26 20:09:06 492浏览

在 CSS max-width 上执行动画

示例

现场演示

<!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>

以上就是在 CSS max-width 上执行动画的详细内容，更多请关注php中文网其它相关文章！

PHP课程HTML视频教程CSS视频JS视频教程Vue视频教程
声明：本文转载于：tutorialspoint，如有侵犯，请联系admin@php.cn删除
上一条：Less 中的颜色通道函数有哪些？ 下一条：CSS 中的上下文选择器是什么？

相关文章

查看更多
  • 热门课程
打开APP，随时随地在线学习！