如何使用引导程序将文本放在进度条旁边?

     2023-03-07     107

关键词:

【中文标题】如何使用引导程序将文本放在进度条旁边?【英文标题】:How to put a text side by a progress bar with bootstrap? 【发布时间】:2017-04-22 04:00:29 【问题描述】:

我希望这些文本设置如下:

Java ---------进度条------------

C# ---------进度条-----------

这是我当前的代码:

<div class="container">
                <p>
                    C#
                </p>
                <div class="progress" id="prog1">
                    <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
                    <span class="sr-only">20% Complete</span>
                    </div>
                </div>
            </div>

【问题讨论】:

【参考方案1】:
<div class="container">
      <p class="col-sm-1">
          C#
      </p>
      <div class="progress col-sm-11" id="prog1">
            <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
                <span class="sr-only">20% Complete</span>
            </div>
      </div>
</div>

【讨论】:

【参考方案2】:
<div class="container">
  <div class ="row">
    <div class ="col-sm-1">
      <p> C# </p>
    </div>
    <div class="col-sm-11">
      <div class="progress" id="prog1">
        <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
          <span class="sr-only">20% Complete</span>
        </div>
      </div>
    </div>
  </div>
</div>

【讨论】:

几乎没有任何变化,伙计:/

如何将进度条放在按钮的底部?

】如何将进度条放在按钮的底部?【英文标题】:HowcanIpositionmyprogressbaratthebottomofabutton?【发布时间】:2019-10-1622:19:23【问题描述】:我遇到了一些问题,我似乎无法弄清楚。我正在尝试创建一个按钮并在其底部添加一个引导进... 查看详情

使用倒计时日期保存当前进度 - 进度条引导程序 4

】使用倒计时日期保存当前进度-进度条引导程序4【英文标题】:Savethecurrentprogressionwithcountdowndate-progressbarbootstrap4【发布时间】:2021-06-2704:42:42【问题描述】:我想使用进度条引导程序4创建动态倒计时日期进度我们可以设置百... 查看详情

如何将进度条放在 NavigationController 工具栏中,如 Mail 应用程序?

】如何将进度条放在NavigationController工具栏中,如Mail应用程序?【英文标题】:HowcanIputaprogressbarinaUINavigationController\'stoolbarliketheMailapp?【发布时间】:2009-11-1819:26:05【问题描述】:我的应用程序连接到网络以检索一些数据,我想... 查看详情

Twitter Bootstrap:进度条居中文本

...引导程序,我希望进度条上的文本以on栏为中心,无论值如何。下面的链接是我现在拥有的。我希望所有文本都与最底部的条对齐。截图:我已经尽我所能使用纯CSS,并且尽可能避免使用JS,但如果这是最干净的方式,我愿 查看详情

输入旁边的引导标签

...述】:我正在尝试将输入字段的标签放在它旁边,而不是使用引导程序放在它上面。将其包装在form-horizontal中是可行的,但它实际上并不是以一种形式(只是一个读取值的ajax调用)。有没有办法简单地将标签移动到输入的左侧... 查看详情

如何使用引导程序将链接放在按钮上?

】如何使用引导程序将链接放在按钮上?【英文标题】:Howtoputalinkonabuttonwithbootstrap?【发布时间】:2016-06-3010:38:45【问题描述】:引导文档中有4种方法:<ahref="#"class="btnbtn-info"role="button">LinkButton</a><buttontype="button"class=... 查看详情

在winforms中将热键/快捷方式文本放在工具条菜单项旁边

...rms中显示分配给工具条菜单项的热键组合。例如,在任何程序(甚至是您的浏览器设置菜单)中,您都可以看到各种菜单项,通常,与它们的项目右侧对齐的是它们的热键快捷 查看详情

如何将响应式文本 div 放在另一个响应式 div 旁边

】如何将响应式文本div放在另一个响应式div旁边【英文标题】:Howtoputaresponsivetextdivnexttoanotherresponsivediv【发布时间】:2016-12-1918:28:46【问题描述】:我有一个包含图像的div和图像旁边的文本div。在宽屏幕上,两者看起来都很好... 查看详情

使用自动布局将 UILabel 放在 UIView 旁边

...|这是文字|我的观点||这是长篇大论|我的看法|你能告诉我如何使用自动布局以编程方式创建这个界面吗?我有这个:self.myL 查看详情

如何使用我的 PHP 脚本中的数据动态更新引导进度条?

】如何使用我的PHP脚本中的数据动态更新引导进度条?【英文标题】:HowdoIdynamicallyupdateabootstrapprogressbarwithdatafrommyPHPscript?【发布时间】:2017-01-3112:35:07【问题描述】:我的网页上有一个引导进度条<divclass="progress"><divclass=... 查看详情

使用引导进度条以模态显示上传进度

】使用引导进度条以模态显示上传进度【英文标题】:DisplayUploadProgressinModalwithBootstrapProgressBar【发布时间】:2015-04-2003:01:02【问题描述】:我正在构建一个c#MVC应用程序,它显示一个表单并允许用户上传一些文件。当用户点击提... 查看详情

如何为进度条引导程序 4 分配自定义颜色

】如何为进度条引导程序4分配自定义颜色【英文标题】:Howtoassigncustomcolortoprogressbarbootsrap4【发布时间】:2020-08-2710:03:33【问题描述】:伙计们,我有进度条:<divclass="progress"><divclass="progress-bar"style="width:a.49%">a.49%</div... 查看详情

如何使用引导程序自动将框中的文本带到中心? [复制]

】如何使用引导程序自动将框中的文本带到中心?[复制]【英文标题】:HowcanIautomaticallybringthetextintheboxtothecenterwithbootstrap?[duplicate]【发布时间】:2021-08-1505:34:35【问题描述】:我需要在中心显示文本的框。我尝试了px类,但它不... 查看详情

如何更新引导进度条。

】如何更新引导进度条。【英文标题】:Howtoupdatebootstrapprogressbar.【发布时间】:2016-11-2216:23:07【问题描述】:关于引导进度条的文档说明了如何显示具有默认值和完成值的进度条,但现在如何更新它?那么,更新值和宽度的最... 查看详情

更新引导程序结束安装 MSI 但在进度条上显示 60/70%

...nprogressbar【发布时间】:2020-07-2307:28:50【问题描述】:我使用msi和引导程序创建我的安装程序Wix。我正在测试更新我的程序。并尝试安装新版本。我想总是使用引导程序。我不知道这是否总是如此,但我做了一些调整并为MSI安装... 查看详情

使用 AsyncTask 显示一个循环进度条

...然后出现总值,我已经完成了计算器和进度条,但不知道如何将它们放在asynctas 查看详情

使用文本和进度条填充 DataGridView

】使用文本和进度条填充DataGridView【英文标题】:PopulatingaDataGridViewwithTextandProgressBars【发布时间】:2011-06-0612:35:00【问题描述】:我正在创建一个多线程应用程序,其中每个线程将在我的DataGridView中显示为一行。我希望在每一... 查看详情

ffmpeg可以显示进度条吗?

...件需要很长时间,我想显示一个进度条。有人可以指导我如何去做。我知道ffmpeg必须以某种方式在文本文件中输出进度,我必须使用ajax调用来读取它。但是如何让ffmpeg将进度输出到文本文件?【问题讨论】:【参考方 查看详情