麻将点数布局（flex布局应用（存在不足，欢迎大神指正））

最新推荐文章于 2024-09-03 10:29:00 发布
最新推荐文章于 2024-09-03 10:29:00 发布
阅读量1.4k 收藏 8
点赞数 1
CC 4.0 BY-SA版权
文章标签： flex 布局 css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_42275455/article/details/82530452
本文详细介绍了使用CSS进行网页布局的多种技巧，包括如何利用Flexbox实现不同场景下的元素排列，如居中、等间距分布及多列布局。通过具体实例展示了圆形、多点布局的实现方法，适合前端开发者学习和参考。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

一点

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
       .box {
        border-radius: 10%;
        width: 110px;
        height: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #FFFFFF;
  border: 2px solid #008000;
   box-shadow: 3px 3px 1px 4px   #2F4F4F; 
}
.zz{
     width: 50px;
        height: 50px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 10px solid  #00FF00;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zzz{
     width: 20px;
        height: 20px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 10px solid  #00FF00;
         display: flex;
  justify-content: center;
  align-items: center;
}
.zzzz{
     width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #00FF00;
}
    </style>

</head>
<body>
<div class="box">
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
</div>
</body>
</html>

二点

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
       .box {
        border-radius: 10%;
        width: 110px;
        height: 150px;
 display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  background-color: #FFFFFF;
  border: 2px solid #008000;
   box-shadow: 3px 3px 1px 4px   #2F4F4F; 
}
.zz{
     width: 50px;
        height: 50px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 10px solid  #00FF00;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zt{
     width: 50px;
        height: 50px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 10px solid  #00FF00;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zzz{
     width: 20px;
        height: 20px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 10px solid  #00FF00;
         display: flex;
  justify-content: center;
  align-items: center;
}
.zzzz{
     width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #00FF00;
}
    </style>

</head>
<body>
<div class="box">
    <div class="zz">
       <div class="zzz"><div class="zzzz"></div></div>
    </div>
    <div class="zt">
       <div class="zzz"><div class="zzzz"></div></div>
    </div>
    </div> 
</div>
</body>
</html>

三点

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
       .box {
        border-radius: 10%;
        width: 110px;
        height: 150px;
   display: flex;
   background-color: #FFFFFF;
  border: 2px solid #008000;
   box-shadow: 3px 3px 1px 4px   #2F4F4F; 
}
.zz{
     width: 25px;
        height: 25px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 6px solid #00FF00;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zt{
     width: 25px;
        height: 25px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 6px solid #00FF00;
        align-self: center;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zy{
     width: 25px;
        height: 25px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 6px solid #00FF00;
        align-self: flex-end;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zzz{
     width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 5px solid #87CEFA;
         display: flex;
  justify-content: center;
  align-items: center;
}
.zzzz{
     width: 5px;
        height: 5px;
        border-radius: 50%;
        background-color:#87CEFA;
}
    </style>

</head>
<body>
<div class="box">
    <div class="zz">
       <div class="zzz"><div class="zzzz"></div></div>
    </div> 
    <div class="zt">
       <div class="zzz"><div class="zzzz"></div></div>
    </div> 
    <div class="zy">
       <div class="zzz"><div class="zzzz"></div></div>
    </div> 
</div>
</body>
</html>

四点

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
       .box {
        border-radius: 10%;
        width: 110px;
        height: 150px;
  background-color: #FFFFFF;
  border: 2px solid #008000;
   box-shadow: 3px 3px 1px 4px   #2F4F4F; 
   display: flex;
  flex-wrap: wrap;
  align-content: space-around;
}
.z{
 flex-basis: 100%;
  display: flex;
  justify-content: space-between;
}
.zz{
     width: 25px;
        height: 25px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 6px solid  #00FF00;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zzz{
     width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 5px solid  #00FF00;
         display: flex;
  justify-content: center;
  align-items: center;
}
.zzzz{
     width: 5px;
        height: 5px;
        border-radius: 50%;
        background-color: #00FF00;
}
    </style>

</head>
<body>
<div class="box">
  <div class="z">
    <div class="zz">
       <div class="zzz"><div class="zzzz"></div></div>
    </div> 
    <div class="zz">
       <div class="zzz"><div class="zzzz"></div></div>
    </div> 
    </div>
    <div class="z">
    <div class="zz">
       <div class="zzz"><div class="zzzz"></div></div>
    </div> 
    <div class="zz">
       <div class="zzz"><div class="zzzz"></div></div>
    </div> 
</div>
</body>
</html>

五点

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
    <style type="text/css">
        .box {
            flex-wrap: wrap;
            flex-direction: column;        
            border-radius: 10%;
        width: 110px;
        height: 150px;
  background-color: #FFFFFF;
  border: 2px solid #008000;
   box-shadow: 3px 3px 1px 4px   #2F4F4F; 
   display: flex;
  /* display: flex;
  flex-wrap: wrap;
  align-content: space-around;*/
}
#div1{
    width: 110px;
        height: 60px;
    display: flex;
    justify-content: space-around;
}
#div2{
    width: 110px;
        height: 30px;
    display: flex;
    justify-content: center;
}
#div3{
    width: 110px;
        height: 60px;
    display: flex;
    justify-content:space-around;
    transform:rotateZ(180deg); 
}
.zz{
     width: 25px;
        height: 25px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 6px solid  #00FF00;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zzz{
     width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 5px solid  #00FF00;
         display: flex;
  justify-content: center;
  align-items: center;
}
.zzzz{
     width: 5px;
        height: 5px;
        border-radius: 50%;
        background-color: #00FF00;
}
#zz1{
    border: 5px solid  #000000;
}


    </style>
</head>
<body>
<div class="box">
<div id="div1"><div class="zz">
       <div class="zzz"><div class="zzzz"></div></div>
    </div><div class="zz">
       <div class="zzz"><div class="zzzz"></div></div>
    </div></div>
<div id="div2"><div class="zz">
       <div class="zzz"><div class="zzzz"></div></div>
    </div></div>
<div id="div3"><div class="zz">
       <div class="zzz"><div class="zzzz"></div></div>
    </div><div class="zz">
       <div class="zzz"><div class="zzzz"></div></div>
    </div></div>
</div>
</body>
</html>

六点

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
       .box {
        width: 110px;
        height: 150px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background-color: #FFFFFF;
  border: 2px solid #87CEFA;
  flex-wrap: wrap;
}
.zz{
     width: 25px;
        height: 25px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 6px solid  #00FF00;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zzz{
     width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 5px solid  #00FF00;
         display: flex;
  justify-content: center;
  align-items: center;
}
.zzzz{
     width: 5px;
        height: 5px;
        border-radius: 50%;
        background-color: #00FF00;
}
    </style>

</head>
<body>
<div class="box">
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 

</div>
</body>
</html>

七点

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title></title>
  <style type="text/css">
    .box {
        width: 110px;
        height: 150px;
/*  display: flex;
  justify-content: space-around;
  align-items: center;*/
  background-color: #FFFFFF;
  border: 2px solid #87CEFA;
  flex-wrap: wrap;
}
#div1{
  width: 110px;
        height: 75px;
        display: flex;
}
#div2{
  width: 110px;
        height: 75px;
        display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}
.zz{
     width: 25px;
        height: 25px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 6px solid  #00FF00;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zzz{
     width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 5px solid  #00FF00;
         display: flex;
  justify-content: center;
  align-items: center;
}
.zzzz{
     width: 5px;
        height: 5px;
        border-radius: 50%;
        background-color: #00FF00;
}
#d1{
align-self: center;
}
#d2{
align-self: flex-end;
}

  </style>

</head>
<body>
<div class="box">
  <div id="div1">
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz" id="d1">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz" id="d2">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
  </div>
  <div id="div2">
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
  </div>
</div>
</body>
</html>

八点

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
       .box {
        width: 110px;
        height: 150px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background-color: #FFFFFF;
  border: 2px solid #87CEFA;
  flex-wrap: wrap;
}
.zz{
     width: 25px;
        height: 25px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 6px solid  #00FF00;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zzz{
     width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 5px solid  #00FF00;
         display: flex;
  justify-content: center;
  align-items: center;
}
.zzzz{
     width: 5px;
        height: 5px;
        border-radius: 50%;
        background-color: #00FF00;
}
    </style>

</head>
<body>
<div class="box">
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
</div>
</body>
</html>

九点

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
       .box {
        width: 110px;
        height: 150px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background-color: #FFFFFF;
  border: 2px solid #87CEFA;
  flex-wrap: wrap;
}
.zz{
     width: 20px;
        height: 20px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 4px solid  #00FF00;
        display: flex;
  justify-content: center;
  align-items: center;
}
.zzz{
     width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #FFFFFF;
        border: 5px solid  #00FF00;
         display: flex;
  justify-content: center;
  align-items: center;
}
.zzzz{
     width: 5px;
        height: 5px;
        border-radius: 50%;
        background-color: #00FF00;
}
    </style>

</head>
<body>
<div class="box">
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
    <div class="zz">
       <div class="zzz">
        <div class="zzzz"></div>
    </div>
    </div> 
</div>
</body>
</html>
flex 布局写出麻将一到九筒
weixin_53388736的博客
05-07 2196
首先写公共样式 *{ margin: 0px; padding: 0; } div{ width: 200px; height: 250px; border: 1px solid red; display: flex; float: left; padding: 20px; } p{ width: 70px; height: 70px; border-radius: 50%; background-color:
复式日麻随机牌山2.0版本（纯html+js）实现
wukefei2003的博客
09-22 769
使用方法：新建.html文件，然后把下面的代码复制进去，最后再浏览器中打开即可 <style> img { height: 36px; } </style> <body> <ul> <li> <button onclick="refresh()">生成随机牌山</button> </li> &lt
我用 flex 布局 写了 9 个麻将
weixin_45178716的博客
03-16 1169
作者：linwanxia/post/7074567009823883300前言为了深入了解 flex 布局，我用 它 写了 9个麻将，当然，你也可以试试骰子，大同小异。先来回顾一下 fle...
[面试专题]Flex 布局
weixin_33938733的博客
08-28 682
Flex 布局 标签（空格分隔）： flex css Flex: Flex是Flexible Box的缩写，意为”弹性布局”，用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。容器分为两种,块flex和行内flex. .box{ display:flex;/*webkit需要加前缀*/ /*display:i...
css面试题之flex实现麻将三饼布局
qq_58174484的博客
04-15 526
麻将应该很多人都熟悉吧，那如何通过flex布局尽可能使用少的节点来实现“三饼（也有人管它叫桶）”的效果呢？（ps:麻将牌效果如下）3.对三个饼依次设置align-self为self-start、center、self-end来实现垂直均分。2.通过设置justify-content: space-between;使得三个饼能够均分区域并排列。1.首先先通过flex修饰外层容器，内部的三个节点分别代表三个大饼。总之，学习css是一个长期积累的过程，积硅步方可至千里。希望本文会对您有所帮助 ^_^
Flex布局入门——实例（扑克牌）
CDTZYXZZY的博客
07-07 416
通过简单的实例，熟悉flex布局的几个简单的属性，感受flex布局的思路
flex麻将和牌源代码
03-16
《flex麻将和牌源代码解析》 在信息技术领域，游戏开发是其中不可或缺的一部分，而麻将作为深受大众喜爱的传统娱乐活动，其电子化形式——网络麻将，更是吸引了众多开发者参与其中。本篇我们将深入探讨一个基于Flex...
麻将连连看.zipIOS应用例子源码下载
03-06
《麻将连连看.zip IOS应用例子源码解析》 在iOS应用开发领域，源码学习是提升技能、理解软件设计思路的重要途径。本篇文章将以“麻将连连看.zip”这个iOS应用的源码为例，深入探讨其背后的编程技术与设计思想。 ...
flex布局学习—实现9个麻将大饼
weixin_44198972的博客
03-18 796
最近在复习flex布局，刷到一篇实现麻将里面9个饼图的博文，练习一下。 效果图 先来回顾一下 flex 布局的几个常用属性： display 为 flex：弹性盒子 justify-content：水平对齐方式 flex-start：主轴靠左对齐（默认值） flex-end：主轴靠右对齐 center：主轴水平居中对齐 space-around：两端对齐，两端间距是中间距离的一半 space-between：两端靠边对齐，中间等距 space-evenly：两端对齐，两端间距与中间距离等距 align-i
红中麻将java源码-Html5GameEngine:HTML5游戏引擎
06-06
红中麻将java源码GitHub 上的游戏 以下是可在 GitHub 上找到的开源游戏和游戏相关项目的列表 - 老式文字冒险、教育游戏、8 位平台游戏、基于浏览器的游戏、独立游戏、GameJam 项目、附加组件/地图/hacks/plugins 用于商业游戏、库、框架、引擎，应有尽有。 贡献 如果您想将存储库添加到列表中，请 或 fork 此存储库并提交拉取请求。 帮助： ， 目录 主要公司 使用 GitHub 选择的主要游戏工作室、发行商等： 基于浏览器 桌游 - 用 HTML/CSS/JS 完成的 3D 国际象棋游戏。 - 在 HTML/CSS/JS 中完成的纸牌麻将游戏。 - 使用 HTML5 和 websockets 的免费国际象棋游戏，使用 Scala、Play 2.1、mongodb 和 elasticsearch 构建。 - 一款免费的在线棋盘游戏，旨在像现实生活中的棋盘游戏一样进行游戏：计算机不强制执行任何规则。 拱廊 - 太空入侵者++。 - 纯 JavaScript 小行星。 - Boulderdash 游戏的 HTML5 版本。 - 用咖啡脚本编写的 HTML5
HTML5 掷骰子游戏 麻将骰子.rar
07-10
基于 HTML5 的掷骰子游戏，点击开始按钮，即可“掷”骰子，代码中有丰富的注释，对研究学习HTML5是很不错的范例。严格来说，这不是游戏，只是掷骰子的动画效果，可用于HTML5开发的掷骰子游戏中。
Majiang, HTML5 JavaScript で動作する麻雀アプリ「電脳麻将」.zip
09-18
Majiang, HTML5 JavaScript で動作する麻雀アプリ「電脳麻将」
Majiang:可在HTML5 + JavaScript上运行的麻将应用程序“ Cyber​​麻将”
04-28
可在HTML5 + JavaScript上运行的麻将应用程序“ Cyber​​麻将” 演示 执照 作者 npm脚本 命令 描述 release 为发布而构建。 build 为调试而构建。 build:js 仅构建用于调试JavaScript。 build:css 仅构建CSS。 build:html 仅构建HTML。 test 执行单元测试。 test:cover 使用覆盖率报告执行单元测试。 文档 程序结构 数据结构，例如Tehai 网络麻将的分数格式 通道数计算 查找听众数量的程序（Chitoitsu，Kokushi Musou） 查找听众人数的程序（普通手版（重新）） 查找听众人数的程序（普通手版（重新）） 程序以查找侦听器的数量（修改后的版本） 完成点计算 程序计算麻将的胜利分数 麻将取胜点的计算-列出情况角色和抽奖角色 查找中奖表格（特殊表格）的程序 查找中奖
HTML5小游戏【H5麻将游戏--425款经典优秀H5小游戏合集】游戏源码分享下载 --- mahjong.zip
最新发布
我的ID：sumer-work（全网同名）昵称：程序员SUMER（全网同名）
09-03 851
HTML5小游戏【H5麻将游戏--425款经典优秀H5小游戏合集】游戏源码分享下载 --- mahjong.zip
两天写成的麻将代码
Intercept86881的博客
02-17 1098
麻将 DFS
html5 麻将游戏价格,html5糖果麻将游戏源码
weixin_36354744的博客
05-30 496
压缩包内容概览：甜蜜麻将5-游戏 ; 资产 ; 现场演示 ; 自述文件 ; 瓦片 ; 索引 ; 舞台上 ; 箭头 ; 阿耳特弥斯寺 ; 块 ; 圈子 ; 经典 ; 硬币 ; 巨像 ; 战斗机 ; 枞树 ; 堡垒 ; 四 ; 大金字塔 ; 空中花园 ; 热巧克力 ; 沙漏 ; 冰滑冰 ; 字母 ; 灯塔 ; 陵墓 ; 纪念碑 ; 船舶 ; 雪花 ; 雪人 ; 蜘蛛 ; 墙 ; 雨伞 ; 西 ; 宙斯...
CSS布局篇之左右布局
热门推荐
前端原创分享，常年坚持记录和分享，全网阅读量超百万
09-13 4万+
左侧定宽，右侧自适应 float + margin .left { float: left; width: 200px; height: 100%; background-color: red; } .right { margin-left: 200px; background-color: blue; } float + over...
CSS 伸缩布局(CSS3)
林彬的专栏
06-07 1046
CSS3在布局方面做了非常大的改进，使得我们对块级元素的布局排列变得十分灵活，适应性非常强，其强大的伸缩性，在响应式开中可以发挥极大的作用。 主轴：Flex容器的主轴主要用来配置Flex项目，默认是水平方向 侧轴：与主轴垂直的轴称作侧轴，默认是垂直方向的 方向：默认主轴从左向右，侧轴默认从上到下 主轴和侧轴并不是固定不变的，通过flex-direction可以互换 Flex布局的语法规范经过几年...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值