小编典典

带 Bootstrap 的固定宽度按钮

all

Bootstrap 是否支持固定宽度的按钮?目前,如果我有 2 个按钮,“保存”和“下载”,按钮大小会根据内容而变化。

还有什么是扩展 Bootstrap 的正确方法?


阅读 94

收藏
2022-06-28

共1个答案

小编典典

您还可以使用.btn-block按钮上的类,使其扩展到父级的宽度。

如果父元素是固定宽度的元素,则按钮将展开以占据所有宽度。您可以将现有标记应用于容器,以确保固定/流体按钮仅占用所需空间。

<div class="span2">
    <p><button class="btn btn-primary btn-block">Save</button></p>
    <p><button class="btn btn-success btn-block">Download</button></p>
</div>



<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />


<div class="span2">
  <p><button class="btn btn-primary btn-block">Save</button></p>
  <p><button class="btn btn-success btn-block">Download</button></p>
</div>
2022-06-28