freeCodeCamp/curriculum/challenges/chinese/03-front-end-libraries/sass/split-your-styles-into-smal...

1.3 KiB
Raw Blame History

id title challengeType forumTopicId
587d7dbf367417b2b2512bbc 用 Partials 将你的样式分成小块 0 301459

--description--

Sass 中的Partials是包含 CSS 代码段的单独文件。这些是在其他 Sass 文件中导入和使用的。我们可以把类似代码放到模块中,以保持代码结构规整且易于管理。

partials的名称以下划线(_)字符开头,告诉 Sass 它是 CSS 的一小部分,而不是将其转换为 CSS 文件。此外Sass 文件以.scss文件扩展名结尾。要将partial中的代码放入另一个 Sass 文件中,请使用@import指令。

例如,如果所有mixins都保存在名为 "_mixins.scss " 的partial中,并且在"main.scss "文件中需要它们,这是如何在主文件中使用它们:

// In the main.scss file

@import 'mixins'

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

--instructions--

编写@import语句,将名为_variables.scsspartial导入 main.scss 文件。

--hints--

你的代码应使用@import指令,并且不应在文件名中包含下划线。

assert(code.match(/@import\s+?('|")variables\1/gi));

--solutions--