前端基础01：HTML

已于 2022-10-08 01:31:20 修改
阅读量275 收藏
点赞数
分类专栏： 前端入门 文章标签： 前端 html
于 2022-09-21 21:32:13 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_61467488/article/details/126979964
版权

一、初识HTML

什么是HTML
  • HTML：Hyper Text Markup Language (超文本标记语言)
    • 超文本：文字、图片、音频、视频、动画等。
  • HTML5：提供了一些新的元素和一些有趣的新特性，同时也建立了一些新的规则。这些元素、特性和规则的建立，提供了许多新的网页功能，如使用网页实现动态渲染图形、图表、图像和动画，以及不需要安装任何插件直接使用网页播放视频等。
  • HTML5的优势
    • 世界知名浏览器厂商对HTML5的支持。(微软、Google、苹果、Opera、Mozilla)
    • 市场的需求。
    • 跨平台。
W3C标准
  • W3C
    • World Wide Web Consortium (万维网联盟)
    • 成立于1994年，Web技术领域最权威和具影响力的国际中立性技术标准机构。
    • http://www.w3.org/
    • http://www.chinaw3c.org
  • W3C标准包括
    • 结构化标准语言 (HTML、XML)
    • 表现标准语言 (CSS)
    • 行为标准 (DOM、ECMAScript)
HTML基本结构

在这里插入图片描述

  • <body> </body>等成对的标签，分别叫开放标签和闭合标签。
  • 单独呈现的标签 (空元素)，如<hr/>，叫自闭和标签，意为用 / 来关闭空元素。
网页基本信息
  • DOCTYPE声明
  • <title>标签
  • <meta>标签
<!-- DOCTYPE：告诉浏览器我们要使用什么规范 -->
<!DOCTYPE html>

<!-- 所有代码都要放到html标签中 -->
<html lang="en">

<!-- head标签代表网页头部 -->
<head>
    <!-- meta描述性标签，用来描述我们网页的一些信息 -->
    <!-- mata标签一般用来做SEO (搜索引擎优化) -->
    <meta charset="UTF-8">
    <meta name="keywords" content="狂神说Java，西部开源">
    <meta name="description" content="来这个地方可以学习Java">

    <!-- title标签代表网页标题 -->
    <title>我的第一个网页</title>
</head>

<!-- body标签代表网页主体 -->
<body>
Hello，World!
</body>
</html>

二、网页基本标签

快捷键：html + tab, p + tab … (其它标签相同)

  • 标题标签：<h1> </h1> ~ <h6> </h6>
  • 段落标签：<p> </p>
  • 换行标签：<br/>
  • 水平线标签：<hr/>
  • 字体样式标签：
    • 粗体：<strong> </strong>
    • 斜体：<em> </em>
  • 注释和特殊符号：
    • 注释：<!-- -->
      • 快捷键：ctrl + /
    • 空格：&nbsp;
    • 大于：&gt;
    • 小于：&lt;
    • 版权符号：&copy;
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本标签学习</title>
</head>
<body>

<!--标题标签-->
<h1>一级标签</h1>
<h2>二级标签</h2>
<h3>三级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>

<!--段落标签-->
<p>两只老虎，两只老虎，</p>
<p>跑得快，跑得快，</p>
<p>一只没有眼睛，</p>
<p>一只没有尾巴，</p>
<p>真奇怪！真奇怪！</p>
<p>两只老虎，两只老虎，</p>
<p>跑得快，跑得快，</p>
<p>一只没有耳朵，</p>
<p>一只没有尾巴，</p>
<p>真奇怪！真奇怪！</p>

<!--水平线标签-->
<hr/>

<!--换行标签-->
两只老虎，两只老虎， <br/>
跑得快，跑得快，<br/>
一只没有眼睛，
一只没有尾巴，<br/>
真奇怪！真奇怪！<br/>
两只老虎，两只老虎，<br/>
跑得快，跑得快，<br/>
一只没有耳朵，
一只没有尾巴，<br/>
真奇怪！真奇怪！<br/>

<!--字体样式标签：粗体，斜体-->
粗体：<strong>i love you</strong>
斜体：<em>i love you</em>
<br/>

<!--特殊符号-->
空     格
空&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;格
&gt; <!--大于-->
&lt; <!--小于-->
&copy; <!--版权符号-->

</body>
</html>

三、图像，超链接，网页布局

图像标签
  • <img src="" alt=""/>
  • 常见的图像格式
    • JPG
    • GIF
    • PNG
    • BMP
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图像标签学习</title>
</head>
<body>
<!--image标签学习
    src(必填)：图片地址 (推荐使用相对路径)
        ../  上一级目录
    alt(必填)：图片名字，图片加载失败时显示
    title：悬停文字，鼠标悬停在图片上时显示
    width：宽
    height：高-->
<img src="../resources/image/1.jpg" alt="小狗" title="悬停显示：小狗" width="1706" height="1280"/>
</body>
</html>
链接标签
  • <a href=""> </a>
  • 超链接：文本超链接，图像超链接
    • 页面间链接
      • 从一个页面链接到另一个页面
    • 锚链接：跳转到标记位置
    • 功能性链接
      • 邮件链接
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>链接标签学习</title>
</head>
<body>

<!--使用name作为标记-->
<a name="top">顶部</a>

<!--a标签学习
    href(必填)：表示要跳转到哪个页面
    target：表示窗口在哪里打开
        _blank：在新标签页中打开
        _self：在当前页面打开-->
<a href="1.我的第一个网页.html" target="_blank">点击我跳转到页面一</a>
<a href="https://www.baidu.com" target="_self">点击我跳转到百度</a>

<br>

<a href="1.我的第一个网页.html">
    <img src="../resources/image/1.jpg" alt="小狗" title="悬停显示：小狗" width="300" height="200">
</a>

<br>

<!--锚链接
    1.需要一个锚标记
    2.跳转到标记-->
<a href="#top">回到顶部</a>
<a href="3.图像标签.html#down">跳转到网址3的底部</a>

<!--功能性链接
    邮件链接：mailto:-->
<a href="mailto:14768760555@163.com">点击联系我</a>
</body>
</html>
网页布局：行内元素和块元素
  • 块元素
    • 块元素会独自占据一整行，或者多行，可以任意设置其大小尺寸，是用于搭建网页布局的必须部分，使网页结构更加紧凑合理。
    • 例如：p、h1-h6、…
  • 行内元素
    • 行内元素不占有独立区域，其大小仅仅被动的依赖于自身内容的大小 (例如文字和图片)，所以一般不能随意设置其宽高、对齐等属性。常用于控制页面中文本的样式。
    • 例如：strong、em、…
  • 默认情况下，行内元素不会以新行开始，而块级元素会新起一行。
  • 一般情况下，行内元素只能包含数据和其他行内元素。 而块级元素可以包含行内元素和其他块级元素。
  • 这种结构上的包含继承区别可以使块级元素创建比行内元素更”大型“的结构。

四、列表，表格，媒体元素

列表
  • 什么是列表
    • 列表就是信息资源的一种展示形式。它可以使信息结构化和条理化，并以列表的样式显示出来，以便浏览者能更快捷地获得相应的信息。
  • 列表的分类
    • 有序列表 <ol> </ol>
    • 无序列表 <ul> </ul>
    • 自定义列表 <dl> </dl>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列表学习</title>
</head>
<body>

<!--有序列表
    应用：试卷、问答...-->
<ol>
    <li>Java</li>
    <li>Python</li>
    <li>运维</li>
    <li>前端</li>
    <li>C/C++</li>
</ol>

<hr>

<!--无序列表
    应用：导航、侧边栏...-->
<ul>
    <li>Java</li>
    <li>Python</li>
    <li>运维</li>
    <li>前端</li>
    <li>C/C++</li>
</ul>

<hr>

<!--自定义列表
    dl：自定义列表标签
    dt：列表名称
    dd：列表内容
    应用：网站底部...-->
<dl>
    <dt>编程语言</dt>

    <dd>Java</dd>
    <dd>Python</dd>
    <dd>Linux</dd>
    <dd>C</dd>

    <dt>城市</dt>

    <dd>西安</dd>
    <dd>重庆</dd>
    <dd>新疆</dd>
    <dd>济宁</dd>
</dl>
</body>
</html>
表格
  • <table> </table>
  • 为什么使用表格
    • 简单通用
    • 结构稳定
  • 基本结构
    • 单元格
    • 行
    • 列
    • 跨行
    • 跨列
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格学习</title>
</head>
<body>

<!--表格 table
    行：tr
    列：td
-->
<!--border：设置边框宽度-->
<table border="1px">
    <tr>
        <!--colspan：跨列-->
        <td colspan="4">1-1</td>
    </tr>
    <tr>
        <!--rowspan：跨行-->
        <td rowspan="2">2-1</td>
        <td>2-2</td>
        <td>2-3</td>
        <td>2-4</td>
    </tr>
    <tr>
        <td>3-1</td>
        <td>3-2</td>
        <td>3-3</td>
    </tr>
</table>
</body>
</html>
媒体元素
  • 视频元素：<video> </video>
  • 音频元素：<audio> </audio>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>媒体元素学习</title>
</head>
<body>
<!--音频和视频
    视频：video
        src：资源路径
        controls：视频工具 (进度条、播放、暂停、下载...)
        autoplay：自动播放
    音频：audio
-->

<video src="../resources/video/1.mp4" controls autoplay></video>

<audio src="../resources/audio/1.mp3" controls autoplay></audio>

</body>
</html>
页面结构分析
元素名描述
header头部区域的内容 (用于整个页面或页面中的一块区域)
footer脚步区域的内容 (用于整个页面或页面中的一块区域)
sectionWeb页面中的一块独立区域
article独立的文章内容
aside相关内容或应用 (常用于侧边栏)
nac导航类辅助内容
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>页面结构分析</title>
</head>
<body>

<header>
    <h2>网页头部</h2>
</header>

<section>
    <h2>网页主体</h2>
</section>

<footer>
    <h2>网页脚部</h2>
</footer>

</body>
</html>
iframe 内联框架
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<!--iframe内联框架：在网站中嵌入一个网站
    src：地址
    width：宽
    height：高
    name：名字，可以配合target使用，在此内联框架中打开网页
    -->

<iframe src="http://www.garen.fun" frameborder="0" width="300px" height="200px"></iframe>


<iframe src="http://www.garen.fun" name="hello" frameborder="0" width="300px" height="200px"></iframe>
<a href="http://www.bilibili.com" target="hello">点击跳转</a>


</body>
</html>

五、表单及表单应用

表单语法

在这里插入图片描述

表单元素格式
属性说明
type指定元素的类型。text、password、checkbox、radio、submit、reset、file、hidden、image 和 button，默认为 text。
name指定表单元素的名称。
value元素的初始值。type 为 radio 时必须指定一个值。
size指定表单元素的初始宽度。当 type 为 text 或 password 时，表单元素的大小以字符为单位。对于其他类型，宽度以像素为单位。
maxlengthtype 为 text 或 password 时，输入的最大字符数。
checkedtype 为 radio 或 checkbox 时，指定按钮是否是被选中。
表单的应用
  • 隐藏域：hidden
  • 只读：readonly
  • 禁用：disabled
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单学习：登录注册</title>
</head>
<body>

<h1>注册</h1>

<!-- 表单form
    action：表单提交的位置。可以是网站，也可以是一个请求处理地址。
    method：提交方式。get、post
        get方式提交：我们可以在url中看到我们提交的信息，不安全，高效。
        post方式提交：比较安全，可以传输大文件。
-->

<form action="1.我的第一个网页.html" method="get">

    <!-- input type="text"：文本输入框
                value：默认初始值
                maxlength：最长能写几个字符
                size：文本框的长度
                readonly：只读-->
    <p>账号：<input type="text" name="username" value="admin" maxlength="8" size="30" readonly></p>

    <!-- input type="password"：密码框
                hidden：隐藏-->
    <p>密码：<input type="password" name="pwd" value="123456" hidden></p>

    <!-- input type="radio"：单选框标签
                value：单选框的值
                name：表示组。如果在同一个组，就不能被同时选中。
                checked：默认值
                disabled：禁用-->
    <p>性别：
        <input type="radio" value="boy" name="sex" checked disabled/>男
        <input type="radio" value="girl" name="sex"/>女
    </p>

    <!-- input type="checkbox"：多选框标签 -->
    <p>爱好：
        <input type="checkbox" value="sleep" name="hobby"/>睡觉
        <input type="checkbox" value="code" name="hobby" checked/>敲代码
        <input type="checkbox" value="chat" name="hobby"/>聊天
        <input type="checkbox" value="game" name="hobby"/>游戏
    </p>

    <!-- input type="button"：普通按钮
         input type="image"：图像按钮，可提交
         input type="submit"：提交
         input type="reset"：重置-->
    <p>按钮：
        <input type="button" name="btn1" value="点击"/>
        <input type="image" src="../resources/image/1.jpg" width="100" height="80"/>
    </p>

    <!-- select：下拉框，列表框 -->
    <p>国家：
        <select name="列表名称">
            <option value="china">中国</option>
            <option value="us">美国</option>
            <option value="etc" selected>瑞士</option> <!--默认值-->
            <option value="india">印度</option>
        </select>
    </p>

    <!-- textarea：文本域
                cols：列
                rows：行-->
    <p>反馈：
        <textarea name="textarea" cols="50" rows="10">文本内容</textarea>
    </p>

    <!-- input type="file"：文件域 -->
    <p>
        <input type="file" name="files"/>
        <input type="button" value="上传" name="upload"/>
    </p>

    <!-- input type="email"：邮箱验证 -->
    <p>邮箱：
        <input type="email" name="email"/>
    </p>

    <!-- input type="url"：url验证 -->
    <p>URL:
        <input type="url" name="url"/>
    </p>

    <!-- input type="number"：数字验证
            max：最大值
            min：最小值
            step：步长-->
    <p>商品数量:
        <input type="number" name="num" max="100" min="0" step="10"/>
    </p>

    <!-- input type="range"：滑块 -->
    <p>音量：
        <input type="range" name="voice" max="100" min="0" step="2"/>
    </p>

    <!-- input type="search"：搜索框 -->
    <p>搜索：
        <input type="search" name="search"/>
    </p>

    <!-- 增强鼠标可用性：指向一个位置 -->
    <p>
        <label for="mark">点我试试</label>
        <input type="text" id="mark">
    </p>

    <p>
        <input type="submit"/>
        <input type="reset" value="清空表单" disabled/>
    </p>
</form>

</body>
</html>

六、表单初级验证

  • placeholder：提示信息，只能用于输入框中
  • required：非空判断，必填
  • pattern：正则表达式判断
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单初级验证</title>
</head>
<body>

<form action="http://www.garen.fun">

    <!-- placeholder：提示信息，用于输入框中
         required：非空判断，必填
         pattern：正则表达式判断-->
    <p>用户名：
        <input type="text" name="username" placeholder="请输入用户名" required>
    </p>

    <p>自定义邮箱：
        <input type="email" name="email" pattern="\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*">
    </p>

    <p>
        <input type="submit">
    </p>

</form>

</body>
</html>
Liangxt1997
关注
专栏目录
前端工程化：基于Vue.js 3.0的设计与实践
weixin_44976692的博客
06-08 4万+
本书由程沛权倾力撰写，基于其多年的前端开发和一线团队管理经验，将Vue 3的知识点按照工程师做项目的实施顺序梳理成章。从前端工程化的基础开始，到TypeScript的深入学习，再到使用TypeScript开发Vue 3项目，通过循序渐进的学习过程，帮助读者在前端工程化领域不断提升实战能力。程沛权，养了三只猫的程序员，热爱烹饪、设计和音乐。在前端领域有多年的开发经验和一线开发团队管理经验。
全面前端开发指南：从基础到深入
03-28
本指南涵盖了从前端基础知识到各种前端框架、工具和技术的广泛范围。主要包括HTML、CSS、JavaScript的基础知识，以及网页布局、CSS预处理器、JavaScript框架、套件管理系统、构建工具等内容。此外，还介绍了一些新兴...
前端入门 01：基础入门
Naisu的各种笔记
09-30 2434
文章目录目的开发工具基础说明简单示例相关拓展第三方库与框架打包成APP后端开发总结题外话 目的 这些年硬件性能越来越好，HTML5、CSS3、ES6等新特性被越来越广泛的支持，前端开发变得越来越火。它简单易上手、效果华丽、跨平台，用作用户界面开发是非常合适的。这篇文章将先介绍一些入门的基础内容，文中涉及的代码等只做演示使用，不用搞懂，后面会另外介绍。 开发工具 前端开发对工具要求很低，有个浏览器和记事本就可以了，当然实际上不到万不得已不推荐这么干。 先说浏览器，浏览器一般用苹果设备上自带的浏览器、chrom
前端-HTML基础知识详解
qq_52262831的博客
12-23 4958
目录： 初始常用的HTML标签 资源路径 列表标签 表格标签 表单标签 表单提交
web前端开发（一）—HTML基础
热门推荐
mdxiaohu的博客
07-31 10万+
  目录 web前端简介 什么是HTML？ HTML标签 HTML基本结构 HTML 段落标签 HTML 换行标签 HTML标题 HTML 水平线 HTML注释 HTML 标签 HTML 列表标签 HTML表格 HTML超链接 HTML 图片 HTML表单 表单元素-文本、密码框 表单元素-多行文本框 表单元素-选择框 表单元素-下拉选择框 表单元素-按钮...
前端必知：3.html中常用的基础标签-行
qq_52799985的博客
07-05 3309
在HTML中，常用的基础标签中的行（inline）标签是用于包裹文本或其他行内元素的标签。这些标签不会独占一行，而是根据文档流的布局在同一行显示，不会自动换行。: 用于包裹文本或其他行内元素，并进行样式设置。: 用于创建超链接。: 用于表示强调的重要文本。通常以加粗显示。: 用于表示强调的文本。通常以斜体显示。: 用于表示计算机代码或程序代码。: 用于插入图像。: 用于创建用户输入字段，如文本框、复选框等。
前端开发基础：html中的div什么意思？
BOM485480的博客
12-04 9249
DIV是层叠样式表中的定位技术，全称DIVision，即为划分。有时可以称其为图层。 DIV元素是用来为HTML（标准通用标记语言下的一个应用）文档内大块（block-level）的内容提供结构和背景的元素。 div标签： <div> 标签定义 HTML 文档中的分隔（DIVision）或部分（section）。div属于web前端的学习内容，其中<div> 标签常用于...
前端HTML5常用基础知识总结
不想学习的打工人的博客
07-11 3019
HTML 全称为 HyperText Markup Language，译为超文本标记语言。在 VS Code 中，新建 html 文件，输入html:5后，按Tab键或回车后，可以快速生成HTML5的骨架： 1.其中，第一行的声明是HTML5标准2.lang指定页面的语言类型，一般常见的有两种：en：定义页面语言为英语 zh-CN：定义页面语言为中文3.head头标签表示的是页面的配置，其内部的常见标签主要有、、等作用：使网页.........
前端基础教程:简单的实现html+css+javascript点赞效果
weixin_63545689的博客
10-03 3000
简单的完成Html + Css + JavaScript的点赞效果！了解其工作的原理，可以在此基础上进行修改创作
前端面试基础题：请写出至少20个HTML5标签
sdasadasds的博客
09-09 2777
header——标记头部区域的内容（用于整个页面或页面中的一块区域）footer——标记脚部区域的内容（用于整个页面或页面中的一块区域）time------标签用来表示HTML网页中出现的日期和时间。meter----标签来显示该给定范围内的数据。mark-----着重标记,默认高亮背景变黄。figure----独立的文档流区域。main----主要内容区域。time------时间标签。output---- 输出框。var------倾斜标签。audio-----音频。video-----视频。
前端基础：HTML表格标签、无序列表、自定义列表
weixin_49555741的博客
03-13 3037
目录 1. 表格标签 1.2 基本语法 1.2 表头单元格标签 1.2.1 表头单元格语法 1.3表格属性 1.3 表格结构标签 1.4 合并单元格 1.4.1 合并单元格的方式 1.4.2 目标单元格 1.4.3 合并单元格三步骤 2. 列表标签 2.1 无序列表（重点） 2.1.1 基本语法 2.2 有序列表(了解） 2.3 自定义列表（重点） 2.3.1 自定义标签语法 1. 表格标签 表格主要是用来显示、展示数据的，一个好的表格可以把繁杂的数...
前端基础知识：HTML.zip
08-18
史上最全web前端技术全套教程，包括： 前端API集成 前端基础知识 前端开发最佳实践 前端性能优化 前端构建工具 前端框架和库 前端测试工具 前端状态管理 等流行技术的系列教程
前端团队管理 前端基础架构的实践和思考 共22页.pdf
06-09
前端团队管理与前端基础架构的实践和思考 前端团队管理是指在软件开发过程中，负责前端开发的团队如何更好地发挥职能作用，提高团队的效率和质量。本文将探讨前端团队的职能转变、前端基础架构的构建和实施，以及...
尚硅谷前端入门html+css零基础教程，零基础前端开发html5+css3视频尚品汇项目源码
03-06
【标题】中的“尚硅谷前端入门html+css零基础教程”指的是一个由尚硅谷教育机构提供的，面向初学者的前端开发课程，主要涵盖了HTML（超文本标记语言）和CSS（层叠样式表）的基础知识。这个教程是为那些对前端开发...
前端用html写excel文件直接打开
全易
09-10 576
html文件直接用excel打开
[项目][WebServer][日志设计]详细讲解
SnowK博客
09-11 4405
[项目][WebServer][日志设计]详细讲解
​美​团​一​面​
最新发布
qq_43858368的博客
09-14 939
同步代码：按照代码的书写顺序立即执行。异步代码：通过关键字，异步操作会被放入微任务队列中等待执行。事件循环：在同步代码执行完毕后，事件循环会检查并执行微任务队列中的任务。async2script endasync1 end这个顺序反映了JavaScript中同步与异步代码的执行机制以及事件循环的工作原理。定义：HEAD请求是一种HTTP方法，它请求服务器返回与GET请求相同的响应头部，但不返回响应的主体部分。用途：主要用于获取资源的元信息，如文件大小、最后修改时间等，而无需下载整个资源。定义。
前端HTML+CSS+JS的入门学习
m0_59247951的博客
09-10 1477
和</p>，其中<p>是开始标签，表示一个段落的开始，而
经验笔记：Web 浏览器存储手段
qq_45831414的博客
09-10 852
以上就是使用 IndexedDB 的基本步骤。IndexedDB 提供了强大的数据存储能力，并且可以通过索引来优化数据检索性能。在实际应用中，可能还需要处理更复杂的场景，比如数据迁移、错误处理等。务必确保你的代码能够妥善处理各种异常情况。
前端开发基础：HTML与VsCode详解
"前端基础知识，包括HTML、VsCode编辑器的介绍与配置，以及HTML基础标签" 在前端开发中，HTML是构建网页的基础，它是一种超文本标记语言，用于描述网页内容和结构。HTML并不是编程语言，而是标记语言，通过各种标签...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值