css布局雪花球水晶球效果代码-html代码-BFW代码库

css布局雪花球水晶球效果代码

代码语言：html

代码描述：css布局雪花球水晶球效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">




    <style>
        body {
            margin: 0;
            padding: 0;  
        		background: #FBD5C5;
        }
        .wrapper {
            display: flex;
        		width: 100vw;
            height: 100vh;
            margin: 0;
            padding: 0;
            align-items: center;
            justify-content: center;
            background: #FBD5C5;
        }
        .wrapper__content {
                width: 800px;
                height: 600px;
                position: relative;
                background: #FBD5C5
            }
        .ball {
            width: 416px;
            height: 440px;
            position: relative;
            margin: 80px auto;
        }
        .ball__glass {
                overflow: hidden;
                width: 416px;
                height: 416px;
                border-radius: 100%;
                background: #28367F;
                position: absolute;
                box-shadow: 0 0 10px 6px rgb(255 255 255 / 38%);
            }
        .ball__stand {
                position: absolute;
                background: #ED6B69;
                bottom: 0;
                width: 266px;
                height: 65px;
                bottom: 0;
                left: 75px;
                border-radius: 6px;
        
            }
        .ball__stand:before,
                .ball__stand:after {
                    content: '';
                    display: block;
                    position: absolute;
                    width: 51px;
                    height: 51px;
     .........完整代码请登录后点击上方下载按钮下载查看