freeCodeCamp

2.1 KiB

Raw Blame History

title

required

challengeType

videoUrl

localeTitle

587d7dbf367417b2b2512bbc

Split Your Styles into Smaller Chunks with Partials

src	raw
https://cdnjs.cloudflare.com/ajax/libs/sass.js/0.10.9/sass.sync.min.js	true

使用Partials将您的样式拆分为较小的块

Description

Partials在萨斯是持有的CSS代码段单独的文件。这些是在其他Sass文件中导入和使用的。这是将类似代码分组到模块中以保持组织有效的好方法。 partials名称以下划线（ _ ）字符开头，告诉Sass它是CSS的一小部分，而不是将其转换为CSS文件。此外，Sass文件以.scss文件扩展名结尾。要将partial的代码放入另一个Sass文件中，请使用@import指令。例如，如果所有mixins都保存在名为“_mixins.scss”的partial ，并且在“main.scss”文件中需要它们，则这是在主文件中使用它们的方法：

//在main.scss文件中

@import'commpins'

请注意， import语句中不需要下划线 - Sass理解它是partial 。将partial导入文件后，可以使用所有变量， mixins和其他代码。

Instructions

编写@import语句，将名为_variables.scss的partial导入main.scss文件。

Tests

tests:
  - text: 您的代码应使用<code>@import</code>指令，并且不应在文件名中包含下划线。
    testString: 'assert(code.match(/@import\s+?("|")variables\1/gi), "Your code should use the <code>@import</code> directive, and should not include the underscore in the file name.");'

Challenge Seed

// The main.scss file

Solution

// solution required

2.1 KiB Raw Blame History Unescape Escape