仅限 Bulma Container 宽屏或全高清
Bulma是 Jeremy Thomas 开发的开源 CSS 框架。该框架基于 CSS Flexbox 属性。它具有高度响应性,最大限度地减少了对响应行为的媒体查询的使用。
在宽屏或全高清容器类的帮助下,我们可以拥有全宽,直到出现任何断点。当我们想要在宽屏中,内容应该是全宽时,我们可以使用这些容器类修饰符来做到这一点。
容器类修饰符:
- is-widescreen :这是使容器全宽直到宽屏断点的类(宽屏断点:1216px)
- is-fullhd :这是使容器全宽直到 FullHD 断点的类(FullHD 断点:1408px)
句法:
示例 1:以下代码演示了is-widescreen修饰符。
HTML
Bulma container widescreen
GeeksforGeeks
Bulma container widescreen
GeeksforGeeks1
GeeksforGeeks2
GeeksforGeeks3
HTML
Bulma container fullhd
GeeksforGeeks
Bulma container fullhd
GeeksforGeeks1
GeeksforGeeks2
GeeksforGeeks3
输出:
示例 2:以下代码演示了is-fullhd修饰符。
HTML
Bulma container fullhd
GeeksforGeeks
Bulma container fullhd
GeeksforGeeks1
GeeksforGeeks2
GeeksforGeeks3
输出:
参考: https://bulma.io/documentation/layout/container/#widescreen-or-fullhd-only