暂无图片
暂无图片
暂无图片
暂无图片
暂无图片

前端库-Sass框架:「09] 用 Partials 将你的样式分成小块

路条编程 2021-08-01
978


Sass,世界上最成熟、最稳定、最强大的专业级 CSS 扩展语言。它添加了使用基本 CSS 语法无法使用的特性。Sass 使开发人员更容易简化和维护项目的样式表。主专题主要介绍变量、嵌套 CSS、条件语句及多种循环语句等。


用 Partials 将你的样式分成小块


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和其他代码。


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


@import 'variables'



今天就讲到这里,如果有问题需要咨询,大家可以直接留言或扫下方二维码关注公众号。也可以添加 happyzjp 微信受邀加入学习社群,我们会尽力为你解答。练习网站已经正式上线,大家可以登陆网站 http://www.icoderoad.com 进行文章中示例的练习。






文章转载自路条编程,如果涉嫌侵权,请发送邮件至:contact@modb.pro进行举报,并提供相关证据,一经查实,墨天轮将立刻删除相关内容。

评论