jquery+css实现减肥卡路里计数器卡片效果代码-html代码-BFW代码库

jquery+css实现减肥卡路里计数器卡片效果代码

代码语言：html

代码描述：jquery+css实现减肥卡路里计数器卡片效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">

    <script src="https://use.typekit.net/nxd0jaz.js"></script>
    <script>
        try{Typekit.load({ async: true });}catch(e){}
    </script>
<style>
    *, *:before, *:after {
  box-sizing: border-box;
}

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  width: 100%;
}

body {
  background: -webkit-linear-gradient(-45deg, #fffe99, #b6feb7);
  background: linear-gradient(-45deg, #fffe99, #b6feb7);
}

.calorie-counter {
  background: -webkit-linear-gradient(top left, #4d4d4d, #000);
  background: linear-gradient(to bottom right, #4d4d4d, #000);
  -webkit-animation: load 1s ease-out forwards;
  -moz-animation: load 1s ease-out forwards;
  animation: load 1s ease-out forwards;
  -webkit-transform: translate3d(-50%, -40%, 0);
  -moz-transform: translate3d(-50%, -40%, 0);
  -ms-transform: translate3d(-50%, -40%, 0);
  -o-transform: translate3d(-50%, -40%, 0);
  transform: translate3d(-50%, -40%, 0);
  background-color: #4d4d4d;
  border-radius: 4px;
  box-shadow: 36px 36px 76px 0px rgba(0, 0, 0, 0.26),.........完整代码请登录后点击上方下载按钮下载查看