单个元素+css实现可交互点击的订书机效果代码-html代码-BFW代码库

单个元素+css实现可交互点击的订书机效果代码

代码语言：html

代码描述：单个元素+css实现可交互点击的订书机效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1">



    <style>
        body {
          position: relative;
          width: 100vw;
          height: 100vh;
          display: grid;
          place-items: center;
        }
        
        input {
          -webkit-appearance: none;
          -moz-appearance: none;
          -webkit-tap-highlight-color: transparent;
          appearance: none;
          display: inline-block;
          width: 85vmin;
          height: 20vmin;
          position: relative;
          transform-origin: 0 0;
          transform: perspective(1000px) rotateY(17.5deg) skewY(-25deg);
        /*   clip-path: polygon(0 0, 78% 0, 99.25% 72.5%, 100% 100%, 17.1% 100%, 16.6% 99%, 0 22%); */
          clip-path: polygon(0 0, 0 -500%, 50.........完整代码请登录后点击上方下载按钮下载查看