【问题标题】:How to center a section with bulma如何用 bulma 使部分居中
【发布时间】:2018-11-10 22:32:57
【问题描述】:

我正在使用 bulma 框架,所有内容都在左侧,我如何将内容放在页面上?例如,此图像位于左侧。

<section class="section">
  <div class="container">
    <div class="column">
      <figure>
        <img src="/assets/images/norris-lake.jpg" alt="Melton Hill Lake">
      </figure>
    </div>
  </div>
</section>

【问题讨论】:

    标签: html css bulma


    【解决方案1】:

    看看Bulma docs for Centering columns

    <link href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.css" rel="stylesheet" />
    <section class="section">
      <div class="container">
        <div class="columns is-centered">
          <div class="column is-half">
            <figure>
              <img src="https://placeimg.com/640/480/any" alt="Melton Hill Lake">
            </figure>
          </div>
        </div>
      </div>
    </section>

    【讨论】:

    • 谢谢,我还在努力去扔文件,我发现自己有时会迷路,在我需要看的地方。我尝试了“is-centered”但没有帮助,所以“is-half”是关键。感谢您的帮助!
    • 这个解决方案解决了问题,但是页面没有响应,即使在小屏幕上,列也会并排
    【解决方案2】:

    我只有在&lt;div class="columns is-centered is-mobile"&gt; 内有&lt;figure&gt; 标签。它对我有用。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2019-02-02
      • 1970-01-01
      • 1970-01-01
      • 2020-08-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多