与电脑打乒乓球游戏赢了后才能取消订阅代码

代码语言:html

所属分类:游戏

代码描述:与电脑打乒乓球游戏赢了后才能取消订阅代码

代码标签: 乒乓球 游戏 订阅

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

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

<head>
    <meta charset="UTF-8">
    <style>
        :root {
      --text-color: #646B8C;
      --headline-color: #2B3044;
      --mail: #555B77;
      --mail-triangle: #494F69;
      --mail-background: #404660;
      --mail-shadow: #D1D6EE;
      --paper: #fff;
      --paper-border: #D1D6EE;
      --confirm-color: #fff;
      --confirm-background: #275EFE;
      --game-paddle: #404660;
      --game-ball: #275EFE;
      --controls-text: #646B8C;
      --controls-icon: #646B8C;
      --controls-background: #E1E6F9;
    }
    
    #unsubscribe button,
    #game button {
      outline: none;
      border: none;
      display: table;
      margin: 0 auto;
      font-size: 14px;
      font-weight: 500;
      font-family: inherit;
      padding: 8px 20px;
      line-height: 21px;
      border-radius: 7px;
      cursor: pointer;
      -webkit-appearance: none;
      -webkit-tap-highlight-color: transparent;
    }
    
    #unsubscribe .letter {
      width: 84px;
      height: 72px;
      margin: 0 auto 32px auto;
      position: relative;
      -webkit-animation: letter 2s ease infinite;
              animation: letter 2s ease infinite;
    }
    #unsubscribe .letter:before, #unsubscribe .letter:after {
      content: '';
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 48px;
      z-index: 1;
    }
    #unsubscribe .letter:before {
      background: var(--mail);
      -webkit-clip-path: polygon(0 0, 50% 55%, 100% 0, 100% 100%, 0 100%);
              clip-path: polygon(0 0, 50% 55%, 100% 0, 100% 100%, 0 100%);
    }
    #unsubscribe .letter:after {
      background: var(--mail-triangle);
      -webkit-clip-path: polygon(0 100%, 50% 55%, 100% 100%);
              clip-path: polygon(0 100%, 50% 55%, 100% 100%);
    }
    #unsubscribe .letter .background {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background: var(--mail-background);
      -webkit-clip-path: polygon(0 24px, 50% 0, 100% 24px, 100% 100%, 0 100%);
              clip-path: polygon(0 24px, 50% 0, 100% 24px, 100% 100%, 0 100%);
    }
    #unsubscribe .letter .shadow {
      background: black;
      width: 92px;
      height: 4px;
      border-radius: 50%;
      position: absolute;
      top: 108%;
      left: -4px;
      background: var(--mail-shadow);
      -webkit-animation: shadow 2s ease infinite;
              animation: shadow 2s ease infinite;
    }
    #unsubscribe .letter .body {
      width: 360px;
      height: 260px;
      bottom: 0;
      left: -138px;
      border-radius: 1px;
      background: var(--paper);
      box-shadow: inset 0 0 0 1px var(--paper-border);
      position: absolute;
      -webkit-transform: translateY(36%) translateZ(0) scale(0.2, 0.16) rotate(90deg);
              transform: translateY(36%) translateZ(0) scale(0.2, 0.16) rotate(90deg);
    }
    #unsubscribe .letter .body .game {
      width: 360px;
      height: 260px;
      position: relative;
      -webkit-transition: opacity .3s ease .8s;
      transition: opacity .3s ease .8s;
    }
    #unsubscribe .letter .body .game .headline {
      position: absolute;
      left: 0;
      right: 0;
      top: -32px;
      display: -webkit-box;
      display: flex;
      -webkit-box-pack: justify;
              j.........完整代码请登录后点击上方下载按钮下载查看

网友评论0