3

我正在使用Bulma CSS 框架，但我根本无法让我的网站像他们的主页一样响应迅速。

该网站是实时的。我的 < html > 具有相同的字体大小，并且我的 dom 结构与 bulma 的主页相同。然而我的手机在手机上看起来很糟糕。

这是我的 HTML 页面的片段：

<html>

<body>
  <section class="hero">
    <div class="hero-body has-text-centered">
      <div class="container">
        <div>
          <h1 class="title">Tiny Text!</h1>
        </div>
      </div>
    </div>
  </section>
</body>

</html>

<html class="route-index">

    <body class="layout-default" style="zoom: 1;">
      <section class="hero is-medium">
        <div class="hero-body has-text-centered">
          <div class="container">
            <h1 class="title">Somehow big text?</h1>
          </div>
        </div>
      </section>
    </body>

</html>

布尔玛页面：

布尔玛 CSS 介绍页面

我的页面：

我的介绍页面


您可以通过 chrome 上的开发人员工具在两个站点的主页上将视口设置为移动设备来测试这一点。

4

1 回答 1

6

尝试添加此元标记

<meta name="viewport" content="width=device-width, initial-scale=1">

这告诉浏览器使页面适合移动屏幕，否则它会为您提供更宽的“桌面站点”

于 2017-01-28T19:24:29.303 回答