Question

此代码（使用引导程序4）使按钮变为全角。

如何使按钮恰好适合其所在的文本？我认为需要将其放在一列中？

  <section class="call-to-action text-white text-center">
    <div class="overlay"></div>
    <div class="container">
      <div class="row">
        <div class="col-xl-12" style="text-align:center">
          <h1>Bunch of text Bunch of text Bunch of text Bunch of text Bunch of text Bunch of text Bunch of text</h1>
          <a href="#scrolltotop" class="btn btn-block btn-lg btn-danger" style="margin-top:40px";>Find Out Now!</a>
        </div>
      </div>
    </div>
  </section>

感谢您提供的所有帮助-我是Bootsrap 4的新手。

Answer 1

只需删除btn-block，然后将col-xs-**放入V4。它由col-**代替

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<section class="call-to-action text-white text-center">
    <div class="overlay"></div>
    <div class="container">
      <div class="row">
        <div class="col-12" style="text-align:center">
          <h1 style="color:black">Bunch of text Bunch of text Bunch of text Bunch of text Bunch of text Bunch of text Bunch of text</h1>
          <a href="#scrolltotop" class="btn btn-md btn-danger" style="margin-top:40px";>Find Out Now!</a>
        </div>
      </div>
    </div>
  </section>

尝试将引导程序按钮居中（避免“全角”）

1 个答案: