zoukankan      html  css  js  c++  java
  • Animate与transform的使用

    Animate是用css给前端加载动画的效果:

    网址:https://daneden.github.io/animate.css/

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <link rel="stylesheet" href="static/css/Animate.css">
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <div  class="animated pulse " style="animation-iteration-count:4" >
            动画
        </div>
        <div  class="animated fadeOutRight infinite" style=" -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(0,-30px, 0);" >
            动画
        </div>
        <div  class="animated bounceOut infinite "  >
            动画
        </div>
    </body>
    </html>
    View Code

    在给代码加载动态时候,需要在它前面加入class:animate (实现循环一次需要的时间设置)infinite (无限循环)。

    修改循环时间:animation-duration: 4s;    修改循环次数:animation-iteration-count:4;修改循环时的x、y、z坐标:transform: translate3d(0,0, 0),x、y、z是指以起点作为坐标。

    from rest_framework import serializers
    from rest_framework.decorators import api_view,authentication_classes
    from rest_framework.response import Response
    from rest_framework.authentication import TokenAuthentication
    from rest_framework.authtoken import views
    from goods.models import GoodsInfo
    
    
    class GoodsSerializers(serializers.ModelSerializer):
        class Meta:
            model = GoodsInfo
            fields = '__all__'
    
    
    @api_view(['get'])
    def info(request):
        info_list = GoodsInfo.objects.all()
        serializer = GoodsSerializers(info_list, many=True)
        return Response(serializer.data)
    View Code

     textarea 禁止拉伸:resize:none

    
    
  • 相关阅读:
    JVM(六)——垃圾回收算法
    JVM(五)——执行引擎、String
    JVM(四)——方法区
    JVM(三)——堆
    JVM(二)——虚拟机栈
    JVM(一)——概述和类加载子系统
    Java EE入门(二十二)——Linux和Nginx
    操作系统(六)——磁盘和IO
    【03】RNN
    【02】时间复杂度
  • 原文地址:https://www.cnblogs.com/shangjunnihao/p/9943529.html
Copyright © 2011-2022 走看看