现代web应用应该支持响应式布局。栅格系统已提供良好的基础构建响应式布局页面，同时也提供一些辅助工具类来控制内容在不同设备的展现方式。
在ZUI中提供针对4中不同尺寸的设备屏幕进行分别控制。
| 屏幕 | 名称 | 尺寸 |
|---|---|---|
| 超小屏幕（手机） | xs | <768px |
| 小屏幕（平板） | sm | >=768px |
| 中等屏幕（笔记本电脑） | md | >=992px |
| 大屏幕（桌面电脑） | lg | >=1200px |
针对4种屏幕类型各定义两种辅助类来在不同的设备上显示或隐藏内容。
| 超小屏幕 | 小屏幕 | 中等屏幕 | 大屏幕 | |
|---|---|---|---|---|
| .visible-xs | 可见 | 隐藏 | 隐藏 | 隐藏 |
| .visible-sm | 隐藏 | 可见 | 隐藏 | 隐藏 |
| .visible-md | 隐藏 | 隐藏 | 可见 | 隐藏 |
| .visible-lg | 隐藏 | 隐藏 | 隐藏 | 可见 |
| .hidden-xs | 隐藏 | 可见 | 可见 | 可见 |
| .hidden-sm | 可见 | 隐藏 | 可见 | 可见 |
| .hidden-md | 可见 | 可见 | 隐藏 | 可见 |
| .hidden-lg | 可见 | 可见 | 可见 | 隐藏 |
其中显示辅助类.visible-xs、.visible-sm、.visible-md、.visible-lg可以组合使用，同理对于隐藏辅助类也可以组合使用以达到不同的效果。但不要将显示辅助类和隐藏辅助类混合使用。
ZUI也提供用来控制打印机的显示与隐藏的辅助类。显示和隐藏不能同时使用。
.visible-print：在打印时显示，在浏览器正常浏览时隐藏。.hidden-print：在浏览器正常浏览时显示，在打印时隐藏。