如何减少 Bulma 中的 class 列表

Question

如何减少实际上看起来像这样的 Bulma 列的 class 定义

<div class="column is-three-quarters-mobile is-three-quarters-tablet is-three-quarters-desctop is-three-quarters-widescreen is-three-quarters-fullhd"></div>

这真的很糟糕。希望有办法只用一个 class 来做我想做的事。谢谢

Answer 1

无论视口大小如何，您似乎都希望列的大小为 3/4。
您可以只使用 is-three-quarters class，它适用于除 mobile.

以外的所有尺寸

要使其也能在移动设备上运行，您必须将 is-mobile class 添加到您的列容器 as explained in the documentation，因此您的代码如下所示：

<div class="columns is-mobile">
    <div class="column is-three-quarters"></div> 
</div>

如何减少 Bulma 中的 class 列表

How to reduce class list in Bulma

css

grid

bulma