有没有办法让按钮组在引导程序中具有网格系统属性？答案

【问题标题】：Is there a way to make button group have like grid system property in bootstrap?有没有办法让按钮组在引导程序中具有网格系统属性？
【发布时间】：2016-09-15 22:42:51
【问题描述】：

我在我的应用程序中使用 bootstrap 3 并在我的应用程序中使用按钮组组件。按钮组有 6 个按钮，我正在使用 btn-group-justified 使宽度变满。这是代码

<div class='btn-group btn-group-justified' role='group' aria-label='slot'>
  <div class='btn-group btn-group-xs' role='group'>
    <button type='submit' class='btn btn-default' value='1' name='menit'>00</button>
  </div>
  <div class='btn-group btn-group-xs' role='group'>
    <button type='submit' class='btn btn-default' value='2' name='menit'>10</button>
  </div>
  <div class='btn-group btn-group-xs' role='group'>";
    <button type='submit' class='btn btn-default' value='3' name='menit'>20</button>
  </div>
...

这是示例图片

我想要实现的是，有没有办法单独使用引导程序使按钮组具有类似属性的网格系统？假设我想删除 10 号按钮并使按钮 00 跨度更宽到按钮 10 的位置。就像在引导程序中使用网格系统一样。问题是按钮对齐使所有按钮具有相同的宽度。我也对 CSS 解决方案持开放态度。

【问题讨论】：

标签： html css twitter-bootstrap

【解决方案1】：

您可以按照以下 sn-p 定义宽度。您必须调整百分比以满足您的特定需求。

.btn-group-justified .btn.weight-1{
    width: 25%;
}

.btn-group-justified .btn.weight-2{
    width: 50%;
}

<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<div class="btn-group btn-group-justified">
  <a href="#" class="btn btn-primary weight-2">Apple</a>
  <a href="#" class="btn btn-primary weight-1">Samsung</a>
  <a href="#" class="btn btn-primary weight-1">Sony</a>
</div>

【讨论】：