Bootstrap自适应导航栏

最新推荐文章于 2024-06-04 08:58:47 发布
最新推荐文章于 2024-06-04 08:58:47 发布
阅读量4.6w 收藏 64
点赞数 6
分类专栏： 页面相关
导航栏在移动设备的视图中是折叠的，随着可用视口宽度的增加，导航栏也会水平展开。在 Bootstrap 导航栏的核心中，导航栏包括了站点名称和基本的导航定义样式。

默认的导航栏

1、向 <nav> 标签添加 class .navbar、.navbar-default。
2、向上面的元素添加 role="navigation"，有助于增加可访问性。
3、向 <div> 元素添加一个标题 class .navbar-header，内部包含了带有 class navbar-brand 的 <a> 元素。这会让文本看起来更大
一号
4、为了向导航栏添加链接，只需要简单地添加带有 class .nav、.navbar-nav 的无序列表即可。

[html]  view plain copy print ?
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4.     <meta charset = "utf-8">  
  5.     <title>demo</title>  
  6.     <link href="bootstrap-3.3.4-dist/css/bootstrap.min.css" rel="stylesheet">  
  7.     <script type="text/javascript" src = "bootstrap-3.3.4-dist/jquery-2.1.4.min.js"></script>  
  8.     <script type="text/javascript" src = "bootstrap-3.3.4-dist/js/bootstrap.min.js"></script>  
  9. </head>  
  10. <body>  
  11.     <nav class = "navbar navbar-default" role = "navigation">  
  12.         <div class="navbar-header">  
  13.             <a class="navbar-brand">hello</a>  
  14.         </div>  
  15.         <ul class="nav navbar-nav">  
  16.             <li class="active"><a href="#">网站首页</a></li>  
  17.             <li><a href="#">JS开发</a></li>  
  18.             <li><a href="#">html</a></li>  
  19.             <li><a href="#">jquery</a></li>  
  20.               
  21.             <li class="dropdown">  
  22.                 <a href="#" class="dropdown-toggle" data-toggle = "dropdown">前端学习 <span class="caret"></span></a>  
  23.   
  24.                 <ul class="dropdown-menu">  
  25.                     <li><a href="#">html+css学习</a></li>  
  26.                     <li><a href="#">javascript学习</a></li>  
  27.                     <li><a href="#">jquery学习</a></li>  
  28.                     <li class="divider"></li>  
  29.                     <li><a href="#">bootstrap学习</a></li>  
  30.                     <li><a href="#">less/sass学习</a></li>  
  31.                     <li><a href="#">angularJS学习</a></li>  
  32.                 </ul>  
  33.             </li>  
  34.         </ul>  
  35.     </nav>  
  36. </body>  
  37. </html>  



响应式的导航栏

1、将要折叠的内容包含在带有class .collapse和.navbar-collspae的<div>中。
2、折叠起来的导航栏是带有class .navbar-toggle以及data-toggle和data-target两个属性的按钮，data-toggle用于告诉javascript
需要对按钮做什么，此处是折叠：collapse，data-target用于指示折叠哪个元素，此处是1中的导航菜单，data-target的属性值是要
指定的元素的id。
3、button中使用带有class .icon-bar的<span>创建所谓的汉堡按钮（就是按钮中多了几个横线）

[html]  view plain copy print ?
  1. <body>  
  2.     <nav class = "navbar navbar-default" role = "navigation">  
  3.         <div class="navbar-header">  
  4.             <button type="button" class="navbar-toggle" data-toggle = "collapse"  data-target = "#target-menu">  
  5.                 <span class="sr-only">qieh</span>  
  6.                 <span class="icon-bar"></span>  
  7.                 <span class="icon-bar"></span>  
  8.                 <span class="icon-bar"></span>  
  9.             </button>  
  10.             <a class="navbar-brand">hello</a>  
  11.         </div>  
  12.         <div class="collapse navbar-collapse" id = "target-menu">  
  13.             <ul class="nav navbar-nav">  
  14.                 <li class="active"><a href="#">网站首页</a></li>  
  15.                 <li><a href="#">JS开发</a></li>  
  16.                 <li><a href="#">html</a></li>  
  17.                 <li><a href="#">jquery</a></li>  
  18.   
  19.                 <li class="dropdown">  
  20.                     <a href="#" class="dropdown-toggle" data-toggle = "dropdown">前端学习 <span class="caret"></span></a>  
  21.                     <ul class="dropdown-menu">  
  22.                         <li><a href="#">html+css学习</a></li>  
  23.                         <li><a href="#">javascript学习</a></li>  
  24.                         <li><a href="#">jquery学习</a></li>  
  25. <pre name="code" class="html">                        <li class="divider"></li>                          
<li><a href="#">bootstrap学习</a></li> <li><a href="#">less/sass学习</a></li> <li><a href="#">angularJS学习</a></li> </ul> </li> </ul> </div> </nav></body> 

 

  
 

 
 

 当屏幕的宽度大于等于768px时，显示与默认的导航栏相同，而屏幕宽度小于768px时，显示效果如下：
 
 
 

 注意:data-target的属性值其实是： #+id，如果只写成id，点击折叠按钮是没有任何反应的，另外，需要引入折叠插件，或者因为
 

 bootstrap.min.js和jquery.js
 
 

 
 

 导航栏中的表单
 
导航中的form表单，需要使用class navbar-form，这确保了表单垂直对齐和在较窄的视口中的折叠行为。使用对齐方式选型来决定 
 

 
 

 导航栏的内容放置在哪里，此处使用了navbar-right，居于右侧（如果使用navbar-left那么就会居于左侧，默认是左侧）。
 
 

 
 
 

 
 

 
 
 
  
 
   [html]  
   view plain 
   copy 
   print 
   ? 
   
 
   
 
  
 
 
 
 
  1.  <body>  
  2.      <nav class = "navbar navbar-default" role = "navigation">  
  3.          <div class="navbar-header">             
  4.              <a class="navbar-brand">hello</a>  
  5.          </div>  
  6.          <div>  
  7.              <ul class="nav navbar-nav">  
  8.                  <li class="active"><a href="#">网站首页</a></li>  
  9.                  <li><a href="#">JS开发</a></li>  
  10.                  <li><a href="#">html</a></li>  
  11.                  <li><a href="#">jquery</a></li>  
  12.              </ul>  
  13.              <form class="navbar-form navbar-right" role="search">  
  14.                  <div class="form-group">  
  15.                      <input type="text" class="form-control" placeholder="Search">  
  16.                  </div>  
  17.                  <button type="submit" class="btn btn-default">提交</button>  
  18.              </form>   
  19.          </div>  
  20.      </nav>  
  21.  </body>  
 

 

 

 
 

 
 
 

 
 
 

 
 

 导航栏中的按钮
 
不在 <form> 中的 <button>或者a 元素。通过 
添加class  
.navbar-btn，使得按钮在导航栏上垂直居中 

 

 
 

 
 
 

 
 

 
 
 
  
 
   [html]  
   view plain 
   copy 
   print 
   ? 
   
 
   
 
  
 
 
 
 
  1.  <body>  
  2.      <nav class = "navbar navbar-default" role = "navigation">  
  3.          <div class="navbar-header">             
  4.              <a class="navbar-brand">hello</a>  
  5.          </div>  
  6.          <div>  
  7.              <ul class="nav navbar-nav">  
  8.                  <li class="active"><a href="#">网站首页</a></li>  
  9.                  <li><a href="#">JS开发</a></li>  
  10.                  <li><a href="#">html</a></li>  
  11.                  <li><a href="#">jquery</a></li>  
  12.              </ul>  
  13.              <form class="navbar-form navbar-right" role="search">  
  14.                  <div class="form-group">  
  15.                      <input type="text" class="form-control" placeholder="Search">  
  16.                  </div>  
  17.                  <button type="submit" class="btn btn-default">提交</button>  
  18.              </form>   
  19.              <button type="button" class="btn btn-primary navbar-btn">button按钮</button>  
  20.              <a href = "#" class="btn btn-warning navbar-btn">链接按钮</a>  
  21.          </div>  
  22.      </nav>  
  23.  </body>  
 

 

 

 
 

 
 
 

 
 

 导航栏中的文本
 

 
 使用 class .navbar-text，确保适当的前导和颜色。 

 

 

 
 

 
 

 
 
 
  
 
   [html]  
   view plain 
   copy 
   print 
   ? 
   
 
   
 
  
 
 
 
 
  1.  <body>  
  2.      <nav class = "navbar navbar-default" role = "navigation">  
  3.          <div class="navbar-header">             
  4.              <a class="navbar-brand">hello</a>  
  5.          </div>  
  6.          <div>  
  7.              <ul class="nav navbar-nav">  
  8.                  <li class="active"><a href="#">网站首页</a></li>  
  9.                  <li><a href="#">JS开发</a></li>  
  10.                  <li><a href="#">html</a></li>  
  11.                  <li><a href="#">jquery</a></li>  
  12.              </ul>  
  13.              <p class="navbar-text">导航栏中文字  
  14.                  <a href="#" class="navbar-link">链接</a>  
  15.              </p>  
  16.          </div>  
  17.      </nav>  
  18.  </body>  
 

 

 

 
 

 
 
 

 
 

 非导航链接
 

 
 使用 class navbar-link 为默认的和倒转的导航栏选项添加适当的颜色，因为默认的a标签的样式可能与导航栏的样式不协调 

 

 

 
 

 
 

 
 
 
  
 
   [html]  
   view plain 
   copy 
   print 
   ? 
   
 
   
 
  
 
 
 
 
  1.  <body>  
  2.      <nav class = "navbar navbar-default  navbar-inverse" role = "navigation">  
  3.          <div class="navbar-header">             
  4.              <a class="navbar-brand">hello</a>  
  5.          </div>  
  6.          <div>  
  7.              <ul class="nav navbar-nav">  
  8.                  <li class="active"><a href="#">网站首页</a></li>  
  9.                  <li><a href="#">JS开发</a></li>  
  10.                  <li><a href="#">html</a></li>  
  11.                  <li><a href="#">jquery</a></li>  
  12.              </ul>  
  13.              <p class="navbar-text">导航栏中文字  
  14.                  <a href="#" class="navbar-link">链接</a>  
  15.              </p>  
  16.          </div>  
  17.      </nav>  
  18.      <div style="background-color:#CCCCCC;height:1000px;">          
  19.      </div>  
  20.      <div style="background-color:#BFFF70;height:200px;">          
  21.      </div>  
  22.  </body>  
 

 

 

 
 

 
 

 固定到顶部
 
如果想要让导航栏固定在页面的顶部，向  
.navbar class 添加 class .navbar-fixed-top。为了防止导航栏与页面主体中的其他内容 
 

 
 

 的顶部相交错，需要向 <body> 标签添加内边距，内边距的值至少是导航栏的高度。
 
 

 
 

 
 
 
  
 
   [html]  
   view plain 
   copy 
   print 
   ? 
   
 
   
 
  
 
 
 
 
  1.  <body>  
  2.      <nav class = "navbar navbar-default navbar-static-top" role = "navigation">  
  3.          <div class="navbar-header">             
  4.              <a class="navbar-brand">hello</a>  
  5.          </div>  
  6.          <div>  
  7.              <ul class="nav navbar-nav">  
  8.                  <li class="active"><a href="#">网站首页</a></li>  
  9.                  <li><a href="#">JS开发</a></li>  
  10.                  <li><a href="#">html</a></li>  
  11.                  <li><a href="#">jquery</a></li>  
  12.              </ul>  
  13.              <p class="navbar-text">导航栏中文字  
  14.                  <a href="#" class="navbar-link">链接</a>  
  15.              </p>  
  16.          </div>  
  17.      </nav>  
  18.      <div style="background-color:#CCCCCC;height:1000px;">          
  19.      </div>  
  20.      <div style="background-color:#BFFF70;height:200px;">          
  21.      </div>  
  22.  </body>  
 

 

 
为了能够看出效果，此处添加了两个有背景色的div。 

 

 
 

 
 
 

 
 
 

 
 

 
 固定到底部，只需要把class .navbar-fixed-top换成.navbar-fixed-bottom即可，不需要在body中添加内边距。 

 

 
  
 
对于给nav添加 .navbar-static-top class，实在是没有看出有什么作用，开始以为是能够创建一个浮动的导航条的。
 

 

 反色的导航栏
 
向  
.navbar class 添加 .navbar-inverse class，创建一个带有黑色背景白色文本的导航栏 
 

 
 

 
 

 
 
 
  
 
   [html]  
   view plain 
   copy 
   print 
   ? 
   
 
   
 
  
 
 
 
 
  1.  <body>  
  2.      <nav class = "navbar navbar-default  navbar-inverse" role = "navigation">  
  3.          <div class="navbar-header">             
  4.              <a class="navbar-brand">hello</a>  
  5.          </div>  
  6.          <div>  
  7.              <ul class="nav navbar-nav">  
  8.                  <li class="active"><a href="#">网站首页</a></li>  
  9.                  <li><a href="#">JS开发</a></li>  
  10.                  <li><a href="#">html</a></li>  
  11.                  <li><a href="#">jquery</a></li>  
  12.              </ul>  
  13.              <p class="navbar-text">导航栏中文字  
  14.                  <a href="#" class="navbar-link">链接</a>  
  15.              </p>  
  16.          </div>  
  17.      </nav>  
  18.      <div style="background-color:#CCCCCC;height:1000px;">          
  19.      </div>  
  20.      <div style="background-color:#BFFF70;height:200px;">          
  21.      </div>  
  22.  </body>  
 

 

 

                

        

        

    




    

      

        

            

              
                
                  sunqian_happy
                
              
            

            

                关注
              
            

        

        

          
    
            
  • 
              
                
                
                
                
                    6
                
              
              
    点赞
    
            
    • 
            
  • 
              
                
                
                
              
              
    踩
    
            
    • 
            
  • 
              
                
                
                
                
                    64
                
              
              
    
                
    
                  
                    收藏
                  
                
    
              
    
              
    
                
    
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
    
              
    
            
    • 
          
  • 
            
    
              
              
            
    
              
              
              
                  5
              
            
            
    评论
    
          
    • 
          
  • 
          
    • 
          
  • 
            
              
            
              
    
            
              
                
            
    
          
    • 
        

      

      

            

                专栏目录
          










                



	

		

			

				
					
bootstrap实现响应式自适应导航栏，并实现平滑滚动

				
			

			

				

					07-11
				

			

		

		

			
				
利用bootstrap和jQuery制作的一个响应式导航栏，即能够监听页面滚动事件，当页面滚动到页面某位置时导航栏会自动发生变化。同时点击导航栏滚动时利用简单的jQuery实现了平滑滚动。而且能自适应屏幕大小的变化，监听了onresize事件。

			
		

	



                

              
                



	

		

			

				
					
Bootstrap4(二十)

				
			

			

				

					shi199434的博客
				

				

					12-18
					
					1037
					
				

			

		

		

			
				
Bootstrap4 导航栏

导航栏一般放在页面的顶部。

我们可以使用 .navbar 类来创建一个标准的导航栏，后面紧跟: .navbar-expand-xl|lg|md|sm 类来创建响应式的导航栏
 (大屏幕水平铺开，小屏幕垂直堆叠)。

导航栏上的选项可以使用  元素并添加 class="navbar-nav" 类。
 然后在  元素上添加 .nav-item 类，  

			
		

	



                


  
              

                


	

		

			

				
					
BootStrap入门到实战：BootStrap组件（二）- 输入框组、导航、导航条、路径导航（面包屑效果）

					
最新发布

				
			

			

				

					林林一928的博客
				

				

					06-04
					
					759
					
				

			

		

		

			
				
导航标签用于在网页上创建各种风格的导航栏，包括水平标签页、胶囊式标签页、垂直堆叠的胶囊式标签页、两端对齐的胶囊式标签页、禁用的链接以及带下拉菜单的标签页。bootstrap的导航条是一个高度可定制的界面组件，它不仅支持丰富的界面元素配置，还提供了灵活的空间布局策略。在实际运用场景中，输入组（Input Group）在Bootstrap框架中主要用于提高表单的可读性和用户友好性，通过将相关控件组合在一起，为用户提供更直观、更易于操作的表单体验。添加相应的尺寸类，其内部包含的元素将自动调整自身的尺寸。

			
		

	





	

		

			

				
					
Bootstrap静止在页面底部的导航栏

				
			

			

				

					P_的博客
				

				

					10-08
					
					8315
					
				

			

		

		

			
				
用Bootstrap制作页面，使用&lt;header&gt;&lt;content&gt;&lt;footer&gt;结构时会遇到，页面内容较少，底部栏或页脚浮到页面中间。

Bootstrap本身提供了navbar-fixed-top 、navbar-fixed-bottom 、navbar-static-top三种方式使用导航条，却无法解决此问题，我们需要navbar-static-bott...

			
		

	



		

			
		



	

		

			

				
					
bootstrap 固定底部导航自适应

				
			

			

				

					黄彪博客
				

				

					09-07
					
					3571
					
				

			

		

		

			
				
在使用bootstrap 底部导航的时候遇到了一个问题 —— 当我的内容超过一屏的时候，底部的部分内容会被固定的导航内容遮盖
 
自己写了一个JS脚本，解决自适应的问题

    
        提交
    




    $(function(){
        autoNav();
    });

    //解决底部自动导航的问题
    funct

			
		

	





	

		

			

				
					
WEB前端网页设计-Bootstrap5 侧边栏导航（Offcanvas）& JavaScript 事件

				
			

			

				

					君逍遥o
				

				

					05-02
					
					5075
					
				

			

		

		

			
				
WEB前端网页设计-Bootstrap5 侧边栏导航（Offcanvas）& JavaScript 事件 

			
		

	





	

		

			

				
					
一篇文章掌握boostrap折叠导航栏

				
			

			

				

					lin1072368472的博客
				

				

					02-14
					
					2109
					
				

			

		

		

			
				
导航栏
创建步骤

nav 标签 添加class navbar  navbar-default（可选）设置导航栏样式 添加 role=“navigation” 有助于可访问性 （详解：将nav转换成导航功能使用）
添加一个div 加上class  navbar-header 导航栏头部
标题中可以添加 a标签 加上class  navbar-brand表示logo或者品牌
无序列表添加 nav n...

			
		

	





	

		

			

				
					
Bootstrap-html渐变顶部固定自适应导航栏

				
			

			

				

					12-12
				

			

		

		

			
				
本示例主要关注如何使用Bootstrap来创建一个具有渐变色彩和顶部固定的自适应导航栏，这对于现代网页设计至关重要。  首先，让我们深入理解这个"Bootstrap-html渐变顶部固定自适应导航栏"的概念。渐变导航栏是指在...

			
		

	





	

		

			

				
					
Bootstrap实现渐变顶部固定自适应导航栏

				
			

			

				

					11-29
				

			

		

		

			
				
具体代码如下所示：  <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html;...link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap

			
		

	





	

		

			

				
					
bootstrap4--导航及导航栏的创建

				
			

			

				

					zxn200125的博客
				

				

					12-19
					
					5202
					
				

			

		

		

			
				
bootstrap4中导航创建和导航栏创建介绍


			
		

	





	

		

			

				
					
手机端自适应底部导航条，带小图标的

				
			

			

				

					02-26
				

			

		

		

			
				
这是一个手机端的自适应底部导航条，带小图标的，包括雪碧图。

			
		

	





	

		

			

				
					
Bootstrap3制作自己的导航栏

				
			

			

				

					11-25
				

			

		

		

			
				
导航栏是一个很好的功能，是Bootstrap 网站的一个突出特点。导航栏是响应式元组件就，作为应用程序或网站的导航标题。导航栏在移动设备的视图中是折叠的，随着可用视口宽度的增加，导航栏也会水平展开。在 Bootstrap 导航栏的核心中，导航栏包括了为站点名称和基本的导航定义样式。
创建一个默认的导航栏的步骤如下：
  向 <nav> 标签添加 class .navbar、.navbar-default（白底黑字），navbar-inverse（黑底白字） 
  向上面的元素添加 role=”navigation”，有助于增加可访问性。 
  向 <div> 元素添加一个标题 class .n

			
		

	





	

		

			

				
					
CSS自适应导航菜单的实例代码

				
			

			

				

					09-24
				

			

		

		

			
				
本篇文章主要介绍了CSS自适应导航菜单的实例代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧

			
		

	





	

		

			

				
					
bootstrap实现导航自适应对于不同的设备

				
			

			

				

					amber_2016的博客
				

				

					11-30
					
					746
					
				

			

		

		

			
				
先说一件小事（嘿嘿，也是吐槽一件事），曾经的曾经面试过一家公司，这家公司说是想用bootsrap做网站，主要是适配从移动端到PC端。当时我所在的公司PC端所做的网站就是用bootstrap做的，但是呢当时公司要求只是适配1024px以上便可。因为当时公司移动端有专门人员负责相关的内容，没必要在网站这块投入人力物力财力在为PC端的页面增强适配性。
 但是呢当时面试官拿着手机访问...

			
		

	





	

		

			

				
					
深入理解BootStrap Item10 -- 导航（nav）

					
热门推荐

				
			

			

				

					小平果的欢乐谷
				

				

					11-15
					
					1万+
					
				

			

		

		

			
				
1、导航（基础样式）导航对于一位前端人员来说并不陌生。可以说导航是一个网站重要的元素组件之一，可以便于用户查找网站所提供的各项功能服务。导航的制作方法也是千奇百怪，五花八门。在这一节中将向大家介绍如何使用Bootstrap框架制作各式各样的导航。在Bootstrap框架将导航独立出来成为一个导航组件，根据不同的版本，可以找到对应的源码：☑ LESS版本：对应的源文件是navs.less☑ Sass版

			
		

	





	

		

			

				
					
自定义bootstrap样式-9行样式自定义漂亮大气bootstrap导航栏

				
			

			

				

					weixin_34167043的博客
				

				

					01-11
					
					4742
					
				

			

		

		

			
				
有人说前端发展太快,框架太多,各有所需，各有所长。看看这幅图，估计都知道这些框架，但是大部分公司中实际要用到的也就那么几个。

发展再快,框架再多。还是得回到原点，不就是Html+Css+JavaScript吗，使用任何牛逼的框架之前你也得把这些东西玩熟练了。bootstrap上大一的时候学html的时候就听老师说过，接触也快一年多了，所以这里准备写一...

			
		

	





	

		

			

				
					
用bootstrap做一个导航栏（自适应）

				
			

			

				

					upup
				

				

					02-16
					
					1954
					
				

			

		

		

			
				
----------------中国加油！陕西加油！武汉加油！！！-------------------------------------
上图


上代码
<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=...

			
		

	





	

		

			

				
					
bootstrap自适应导航栏

				
			

			

				

					12-30
				

			

		

		

			
				
Bootstrap是一个流行的前端开发框架，提供了许多用于快速开发网页的工具和组件，其中包括自适应导航栏。  在Bootstrap中，我们可以使用类名"navbar"和"navbar-expand"来创建一个自适应的导航栏。首先，我们需要一个...

			
		

	



              



  
“相关推荐”对你有帮助么？

  

      
    
          
  • 
              
    
                  
                  
              
    
              
    非常没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    一般
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    有帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    非常有帮助
    
          
    • 
      

      

      

          
          提交
      

      

  




          




        



    





    



      

      

        
      

      





	

		
评论 5

	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

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

              

            

          

      

      余额充值