html - 使用 bootstrap 调整大小时调整文本

Question

如何使用 bootstrap 重新缩放文本？ (实际上是一个h2)问题是标题超出了它的范围。这是 css 框代码:

.buton{
    padding-top:50px;
    padding-bottom:50px;
    border:2px solid #E3A739;
    border-radius:10px;
    margin-top:3em;
    margin-bottom:3em;
}

这是 HTML 代码:

<div class="row">
                    <div id="iteme" class="buton col-xs-3 col-md-3 col-lg-3">
                        <h2>Iteme</h2>
                    </div>
                  .....

如何在调整页面本身时调整标题大小？ (我想让网站响应)

Answer 1

你可以使用 vw 而不是 px :

.buton h2{
    font-size:3vw;
}

您应该根据需要更改变量，您也可以对它使用媒体查询，因为在小型设备中，它可能会随着实际值 (3vw) 变得不可见，因此您可以为小型设备更改它成为更大的值(value)。

您可以在此处检查浏览器对视口(viewport)单位的支持:CanIUseIt

我希望这会有所帮助。