关于 SAP Spartacus feature library 里的 _index.scss 文件-阿里云开发者社区

开发者社区> -开发者助手-> 正文

关于 SAP Spartacus feature library 里的 _index.scss 文件

简介: 关于 SAP Spartacus feature library 里的 _index.scss 文件
+关注继续查看

image.pngimage.png查看这个 @import 的语法:


Sass 扩展了 CSS 的 @import 规则,能够导入 Sass 和 CSS 样式表,提供对 mixin、函数和变量的访问,并将多个样式表的 CSS 组合在一起。 与需要浏览器在呈现页面时发出多个 HTTP 请求的普通 CSS 导入不同,Sass 导入完全在编译期间处理。


Sass 导入的语法与 CSS 导入相同,只是它们允许多个导入用逗号分隔,而不是要求每个导入都有自己的 @import。 此外,在缩进语法中,导入的 URL 不需要引号。


考虑下列两个文件:

image.png注意语法,slash 后面,下划线和扩展名 .scss 自动消失。


当 Sass 导入一个文件时,该文件被评估,就好像它的内容直接出现在 @import 的位置。 导入文件中的任何混入、函数和变量都可用,并且其所有 CSS 都包含在编写 @import 的确切位置。 更重要的是,在@import 之前定义的任何mixin、函数或变量(包括来自其他@imports)都可以在导入的样式表中使用。


注意,需要小心重复导入问题:


如果多次导入相同的样式表,则每次都会重新评估。 如果它只是定义了函数和 mixin,这通常没什么大不了的,但是如果它包含样式规则,它们将被多次编译为 CSS。


被导入 scss 文件的定位问题

为了确保样式表适用于每个操作系统,Sass 通过 URL 而不是文件路径导入文件。 这意味着您需要使用正斜杠,而不是反斜杠,即使您使用的是 Windows。


注意:如下图所示:Windows10 使用的是反斜杠:

image.pngLoad paths

所有 Sass 实现都允许用户提供加载路径:Sass 在解析导入时将查找的文件系统上的路径。 例如,如果你通过 node_modules/susy/sass 作为加载路径,你可以使用@import “susy” 来加载 node_modules/susy/sass/susy.scss。


但是,导入将始终首先相对于当前文件进行解析。 仅当不存在与导入匹配的相关文件时才会使用加载路径。这可确保您在添加新库时不会意外弄乱相对导入。


与其他一些语言不同,Sass 不要求您使用 ./ 进行相对导入。相对导入始终可用。


Partials

按照惯例,仅用于导入而非自行编译的 Sass 文件以 _ 开头(如在 _code.scss 中)。 这些被称为部分,它们告诉 Sass 工具不要尝试自己编译这些文件。 您可以在导入部分时省略 _。


如果您在文件夹中写入 _index.scss 或 _index.sass,则在导入文件夹本身时,该文件将被加载到其位置。


下列是一个例子:


_code.scss 和 _lists.scss 被同一文件夹下的 _index.scss 导入:

image.pngimage.png


版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
阿里云服务器怎么设置密码?怎么停机?怎么重启服务器?
如果在创建实例时没有设置密码,或者密码丢失,您可以在控制台上重新设置实例的登录密码。本文仅描述如何在 ECS 管理控制台上修改实例登录密码。
9193 0
如何在函数计算中使用 Node.js 处理 multipart 文件上传请求
web 开发中我们经常会允许用户通过 HTTP POST 请求上传文档到服务器,本文将介绍在函数计算中基于 node.js 使用 multipart form-data 来实现文件上传服务。
2708 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,大概有三种登录方式:
2899 0
阿里云服务器端口号设置
阿里云服务器初级使用者可能面临的问题之一. 使用tomcat或者其他服务器软件设置端口号后,比如 一些不是默认的, mysql的 3306, mssql的1433,有时候打不开网页, 原因是没有在ecs安全组去设置这个端口号. 解决: 点击ecs下网络和安全下的安全组 在弹出的安全组中,如果没有就新建安全组,然后点击配置规则 最后如上图点击添加...或快速创建.   have fun!  将编程看作是一门艺术,而不单单是个技术。
10761 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,阿里云优惠总结大概有三种登录方式: 登录到ECS云服务器控制台 在ECS云服务器控制台用户可以更改密码、更换系.
12894 0
文件的相对路径和绝对路径
package cn.com; import java.io.File; //文件的相对路径和绝对路径 //注意: //这里有一个小问题,我们这里在建立File对象的时候传的是绝对路径"F:\\f1.txt" //然后调用getAbsolutePath()和getPath()是没有什么区别的,输出的都是绝对路径。
653 0
x3d
yii的入口文件index.php中为什么会有这两句
yii的应用模板中,index.php中 前面会有这两句
737 0
2450
文章
0
问答
来源圈子
更多
+ 订阅
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载