5

在我的 CSS 文件中应用 Bourbon Neat 的命令并且不显示 html 文件中的列,如果显示应用的结果但不显示列。

.container{
    @include outer-container;
    @include span-columns(2 of 8, table);
    border: 1px solid red;
    margin: 0 auto;
    position: relative;
    width: 960px;
}

当显示为 sass 生成的 css 时,不显示 Bourbon Neat 列的背景属性。

4

4 回答 4

14

重要的是在行之前设置$visual-grid: true;和定义断点@import "neat";

来自https://github.com/thoughtbot/neat#using-neat

只要 在导入 Neat之前定义了媒体上下文,可视网格就会反映通过 new-breakpoint() mixin 应用于网格的更改。

您是否选择使用_grid-settings.scss文件(如文档推荐的那样)取决于您。但是为了完全看到视觉网格,您肯定需要$visual-grid: true;在导入之前进行设置。为了让视觉网格做出响应,您还需要在导入整洁之前定义断点。

于 2013-09-10T01:31:27.577 回答
11

不幸的是,只需添加“$visual-grid: true;” 在容器中不起作用。或者至少它对我不起作用。但是,在文件中添加具有以下设置的“_getting-settings.scss”文件对我有用:

$visual-grid: true;
$visual-grid-color: yellow;
$visual-grid-index: front;
$visual-grid-opacity: 0.5;

文档不是很清楚 $visual-gridL 应该去哪里,所以很难判断这是否符合开发人员的意图。我认为他们需要在这种情况下提供更好的例子。

于 2013-09-09T22:01:39.557 回答
1

在容器中,您需要添加

  $visual-grid: true;

这应该显示用于调试的网格列背景。

于 2013-04-04T20:35:05.730 回答
1
  1. 制作如下文件(根据您自己的要求调整设置)。 此文件会覆盖 _visual-grid.scss整洁的设置目录中的整洁默认设置。

  2. 将导入添加到您刚刚创建的行之前(之后将不起作用)您将主整洁文件导入到您的主项目 SCSS 文件中。

_neatsettings.scss

// Neat Settings

$visual-grid: true;
$visual-grid-color: #faa;
$visual-grid-index: front;
于 2015-06-01T18:29:56.763 回答