zoukankan      html  css  js  c++  java
  • css过渡和动画

    一、transition(过渡):

      1.规定使用属性的名称;

      2.规定时长;

      3.配合hover的使用。

        div{

           100px;

           height:50px;

           background:red;

           transition:width 5s linear 2s;

            }

         div:hover{

            1200px;

            height:200px;

            

                }

    二、动画(animation):

      @keyframe规则用于创建动画。(必须要在代码前面加入浏览器前缀,实现兼容性)

      1.绑定选择器;

      2.动画名称;

      3.动画时长。

        div{

           100px;

            height:50px;

            background:red;

            border:1px soild black;

            position:relative;

              animation:myfirst 5s linear 2s infinite;

              }

          @keyframe myfirst{

            0% {backgroud:black; left:0px; top:0px;}

            25%{background:yellow;left:200px;top:0px;}

            50%{background:green;left:200px;top:200px;}

            75%{background:bule;left:0px;top:200px;}

            100%{background:red;left:0px;top:0px;}

                      }

  • 相关阅读:
    RHEL安装oracle客户端(版本为11.2)
    为服务器设置固定IP地址
    RHEL配置本地yum
    网线水晶头内线排序
    《汇编语言(第三版)》王爽著----读书笔记01
    kali系统越来越大解决
    Markdown入门简介
    Linux之tail命令
    Linux之df命令
    Linux命令
  • 原文地址:https://www.cnblogs.com/xingxing88/p/5861320.html
Copyright © 2011-2022 走看看