如何响应地使用本质网格

Question

本质CSS框架有一个网格组件。但是，我不知道如何响应地使用它。例如，如何指定特定于手机，平板电脑和桌面的网格选项？

Answer 1

使用着的http://getessence.io/core/grid-system

的“有求必应GRID”一节中的类使用brick类，然后添加一个或多个以下的类来在各种平台上指定元素的宽度：

• brick-X桌面
• brick-X-tablet片剂

• brick-X-mobile的手机

  凡X = 1...12

如在属性部分所描述的，阈值是：

• ...mobile具有768px
• ...tablet一个最大宽度为1,024像素x
一个最大宽度

例如：

<Block classes={'e-row'}> 
<Block classes={'brick brick-3 brick-6-tablet brick-12-mobile'}>brick-3 brick-6-tablet brick-12-mobile</Block> 
<Block classes={'brick brick-6 brick-6-tablet brick-12-mobile'}>brick-6 brick-6-tablet brick-12-mobile</Block> 
<Block classes={'brick brick-6 brick-12-tablet brick-12-mobile'}>brick-6 brick-12-tablet brick-12-mobile</Block> 
</Block>