Bootstrap btn块按钮的引导设置高度

sg24os4d 于 2023-04-27 发布在 Bootstrap

关注(0)|答案(3)|浏览(199)

我的代码看起来像这样：

<div class="row">
  <div class="col-xs-4">
    <a class="btn btn-default btn-block" href="#">1</a>
  </div>
  <div class="col-xs-4">
    <a class="btn btn-default btn-block" href="#">2</a>
  </div>
  <div class="col-xs-4">
      <a class="btn btn-default btn-block" href="#">3</a>
  </div>
</div>

这给了我3个按钮，这是我想要的。我想做的是让按钮更高。如果可能的话，我宁愿不以像素为单位指定高度，以便它可以更好地缩放到不同的屏幕尺寸。我可以指定高度为（宽度的）比例或屏幕高度的百分比吗？
先谢谢你了。

twitter-bootstrap

来源：https://stackoverflow.com/questions/25174391/bootstrap-setting-height-for-btn-block-buttons

3条答案

按热度按时间

57hvy0tb1#

最简单和最好的解决方案是添加顶部和底部填充。

.btn-block {
    padding: 10% 0; 
    /* define values in pixels / Percentage or em. whatever suits 
       your requirements */
}

赞(0）回复(0）举报 2023-04-27

wb1gzix02#

使用引导填充属性p-. Documentation

<a class="btn btn-default btn-block p-3" href="#">1</a>

赞(0）回复(0）举报 2023-04-27

q9yhzks03#

实际上，只需使用py-4作为按钮上的额外类。
py-#同时在顶部和底部增加了填充，你可以通过改变数字来选择多少（我认为max是4，但我可能错了）。
您可以在这里检查所有选项（至少从Bootstrap 4开始它可以工作）。

赞(0）回复(0）举报 2023-04-27

我来回答

Bootstrap btn块按钮的引导设置高度

3条答案

相关问题

热门标签

最新问答