大转盘效果-html代码-BFW代码库

大转盘效果

代码语言：html

所属分类：动画

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<title>  Life&#39;s Wheel</title>
<style>
  @import url("https://fonts.googleapis.com/css?family=Atma:700|Source+Sans+Pro:900&display=swap");

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}
body {
    min-height: 100vh;
    font-family: "Source Sans Pro", sans-serif;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: hsl(0, 0%, 100%);
    background: url("data:image/svg+xml,%3Csvg opacity='0.1' xmlns='http://www.w3.org/2000/svg' viewBox='-50 -50 100 100' width='350' height='350'%3E%3Cpath id='sign' d='M -25 25 a 25 25 0 0 1 -25 -25 25 25 0 0 1 50 0 25 25 0 0 0 50 0 25 25 0 0 0 -25 -25' fill='none' stroke='white' stroke-width='5' /%3E%3Cuse href='%23sign' x='50' y='50' /%3E%3Cuse href='%23sign' x='50' y='-50' /%3E%3Cuse href='%23sign' x='-50' y='50' /%3E%3Cuse href='%23sign' x='-50' y='-50' /%3E%3C/svg%3E"),
        hsl(300, 90%, 3%);
    background-size: 50px;
}

body > * + * {
    mar.........完整代码请登录后点击上方下载按钮下载查看