代码之家 › 专栏 › 技术社区 › p7adams

基础ZURB的网格边缘水槽不能正常工作。

zurb-foundation-6 zurb-foundation sass

p7adams · 技术社区 · 7 年前

在我正在工作的项目中,我试图用Zurb基金会6为站点实现简单的事情。 over 1280px grid gutters should be 20px ,under 1280px grid gutters should be 10px 。我已经更改了下面屏幕截图上的settings.scss,但无论如何它都不起作用。过去有人面临同样的问题吗?? 我想在 $grid margin gutters中找到大型和大型断点的映射值。

. 20PX 下 1280PX 格栅排水沟应 10px . 我已经更改了下面屏幕截图上的settings.scss,但无论如何它都不起作用。过去有人面临同样的问题吗?? 我想加入 $grid毛利槽 为大断点和大断点映射值。

1 回复 | 直到 7 年前

p7adams 7 年前

对于面临同样问题的人。 答案是: 如果这样 $grid毛利槽 不能按预期工作-请确保 $grid毛利槽 映射您正在放置从最小的断点开始的所有断点。因此,遵循以下模式:

$grid-margin-gutters: (
   small: 10px, 
   medium: 10px, 
   large: 20px,
   yourCustomBreakpoint: 30px
);

别忘了在变量中添加这些自定义断点 $断点类: 如下所示:

$breakpoint-classes: (small medium large yourCustomBreakpoint xxlarge);

现在按预期工作,编译时没有任何错误。

推荐文章

Matt · 基础6使用SASS更改排水沟宽度

8 年前

Dhiraj Sharma · 网页包中的基础抛出错误

8 年前

coolsaint Christian C. Salvadó · 在Foundation 6.4.3卡中,如何阻止图像在Flexbox容器内拉伸?

8 年前

Nir Tzezana · Foundation 6 catch drilldown click事件

8 年前

tomislav_t · 将单元均匀分布在Zurb基础6的立柱上

8 年前

Dwight Gunning · Karma单元测试Vue。js+基础

8 年前

Run · 基础6.4.1-引导。容器等效物?

9 年前

foufrix · Css滚动和大小调整

9 年前

ManxJason · 使用基础“柔性网格”集中对齐嵌套项

9 年前

Ahad Porkar · Foundation 6子菜单展开不工作

10 年前