响应性

Bulma 中每个元素都是 移动优先 的，并针对 垂直阅读 进行优化, 并且默认为在移动设备上显示:

• columns 是垂直堆放的
• level 组件的子元素将垂直堆放
• nav 导航菜单将会隐藏

例如, 您可以通过添加 is-mobile 修饰符，强制让columns 或 nav 变为 水平 布局。

Bulma 有 5 个断点:

• mobile: up to 768px
• tablet: from 769px
• desktop: from 1024px
• widescreen: from 1216px
• New! fullhd: from 1408px

Bulma 9种混合响应:

• =mobile
  until 768px
• =tablet
  from 769px
• =tablet-only
  from 769px and until 1023px
• =touch
  until 1023px
• =desktop
  from 1024px
• =desktop-only
  from 1024px and until 1215px
• =widescreen
  from 1216px
• =widescreen-only
  from 1216px and until 1407px
• New! =fullhd
  from 1408px

你可以使用 这些变量 来 自定义 响应断点. 只需要简单的在导入 Bulma 之前 设置这些变量 学习如何这么做。