我刚刚开始使用compass，需要在一个燃料项目中使用它，所以运行compass create对我来说是不可行的 我已经手动导入了文件，但是它将compact（）放在我所有的混音器上，使它们无法工作 我已经重新安装了宝石，但仍然没有运气 有什么想法吗？我认为可能的问题是Compass在Ruby中定义了compact（）函数，因此没有包括在内。最简单的解决方案是在Sass中重新实现该函数 其他人在这里发布了相应的解决方案：我不明白您看到了什么。你能举个例子吗？是的，我有点困惑你到底看到了什么。代码

当您有一个使用sass@import导入其他文件的包装器样式表，并且使用guard监视更改时，如果您只更改一个导入的文件，它将不会自动编译包装器样式表。例如： /* This is viewports.scss, which must compile into viewports.css */ @media only screen and (min-width: 480px) { @import "480.scss"; } @media only screen and (min-wid

我今天刚开始用sass，遇到了第一个障碍。我不知道如何在我的scss文件中使用字体。以下是我在app.scss文件中尝试的内容： //do I need this line? I have installed compass @import "compass/css3"; @include font-face("myfont", font-files("myfont.eot", "myfont.woff", "myfont.ttf", "myfont.svg#myfont")); 这就是我得

我对sass很陌生。我用不同的值定义了14个不同的变量$skill-1、$skill-2等，并调用一个mixin到不同的id的不同宽度 我犯了个错误 Undefined variable: "$skill-". 这是我的代码示例 @mixin skill-func($val) { & { width : $val; } } $i: 14; @while $i > 0 { #skill-#{$i} { @i

此代码适用于： //test.scss @import "imageColor"; body { $sourceFile: resources/icon/mask; $targetFile: resources/compass/images/icon; $color: red; @include createMask($sourceFile, $targetPath, $color); } 此代码不起作用

您好，我想创建一个用于在SCSS中导入文件的变量，如下所示： $theme : 'my_theme'; @import "#{$theme}/import"; 但这会给我返回以下错误： Syntax error: File to import not found or unreadable: #{$theme}/import. 我还没有找到这方面的信息，只是这是不可能的。 是否存在使其工作的变通方法 感谢只有当插入的字符串或url（）是有效的字符串/url时，原始实现才起作用；这意味着您不能

我刚刚开始在我的编码过程中使用AutoRefixer。我正在使用grunt自动刷新器 在我的Grunfile.js中 sass: { dist: { options: { sourcemap: true }, files:{ 'css/style.css': 'sass/style.scss' } } }, autoprefixer: { dist: { options: {

当我运行time sassc app.scss app.css时，编译时间非常快： sassc是用于libsass库上的C实现的命令行包装器 real __0m0.132s__ user 0m0.123s sys 0m0.007s 但是，当使用grunt sass时，它是Node.js对libsass的包装器， 在我的Gruntfile.js中，我得到的输出要慢得多： Running "watch" task Waiting... File "stylesheets/sass/ap

我已经开始使用Thorax，我已经使用Thorax generator和yeoman来设置一个Web应用程序： $ npm install -g yo generator-thorax $ yo thorax desired-application $ cd desired-application $ grunt 我选择了SASS作为css预处理器，然后我可以在使用grunt命令构建webapp后成功运行它 现在我的问题是，我不确定如何将susy添加到我的Grunfile.js中。 应向SAS

我正在使用foundation 5，并在main.scss中引用它 @import "settings_override"; // i override the core settings with this @import "foundation/foundation"; Core foundation 5 files 在foundation/foundation.scss中，我想注释掉一些组件，但如何在不编辑核心文件的情况下进行注释 我试过了 @import "settings_over

当我使用Brunch.io将我的SCSS代码编译成CSS时，它会向CSS添加以下内容 @media -sass-debug-info{filename{font-family:file\:[*FILE PATH REMOVED*]/reset\.scss}line{font-family:\000031}} 我曾尝试在早午餐配置文件中添加一个“quiet”标志（如下所示：），但这似乎没有什么不同 如何阻止编译器添加这些行？尝试将：debug\u info禁用为false。如config.rb中

我有一个自己开发的CSS框架，有时必须包含在已经有其他HTML/CSS的页面上。为了避免CSS冲突，我想在所有内容前面放置一个父ID选择器，以便CSS是这样生成的：#MyFramework.thing one{/*styles*/}。但我希望这是可选的，并通过变量设置。因此，我提出了以下内容，但它不起作用，但也不会产生任何Sass错误。有没有正确的方法可以做到这一点 $framework-wrap: true; @if $framework-wrap { #MyFramework {

我正在尝试在Chrome canary中设置映射功能。我跟着截图走了进去 主要功能起作用了，当我检查一个元素时，它会指向我的本地sass文件，当我编辑它时，本地文件会安全，并且会触发“sass--watch”。但是，即使在devtools中的“常规”选项卡上，我选中了“Sass保存时自动重新加载CSS”，浏览器也不会刷新 浏览器应该重新加载吗？有没有办法让它重新加载 Ps-我有指南针，但我不能使用它，因为它不支持映射，所以我通过终端编译sass 谢谢我通过安装Extension解决了这个问题，现

我试图使用条件创建一个mixin，但在编译时遇到了一个错误。正在生成的错误是： Error: Properties are only allowed within rules, directives, mixin includes, or other properties. 以下是我正在使用的代码： @mixin mypadder ($topBottomBoth: myDefaultOption, $topUnits: 0, $bottomUnits: 0) { @if $topBot

我有一个SailsJs项目。并且需要安装引导sass版本。 我正在使用grunt contrib sass。但是我真的需要安装ruby吗？ 我可以修改grunt吗，这样节点sass将负责编译？以下示例： 不要使用grunt-contrib-sass，而是使用grunt-sass来避免Ruby依赖性： 纱线：纱线添加grunt sass NPM:NPM i——保存grunt sass 安装引导式sass： 纱线：纱线添加引导sass NPM:NPM i——保存引导sass 假设您遵循了上面

我将为我的公司创建一个模式库。我正在使用以下软件： css-loader@0.23.1 提取文本网页包-plugin@1.0.1 节点-sass@3.8.0 无礼-loader@4.0.0 风格-loader@0.13.1 webpack@1.13.2 解析url-loader@1.6.0 node@6.3.1 npm@3.10.3 在我的计算机上（Windows 10） 我的目标是使用@import“colors”语句并获得相应的文件。/patterns/globals/\u colors

我试图将一个scss文件（在名为variables.scss的主题中可用）导入另一个scss文件（名为tick tock.component.scss），但收到以下错误消息 错误：要导入的文件找不到或不可读：../../theme/variables 下面是我尝试导入文件的方式 但如果我给出绝对路径，它的工作原理如下。（哪种方式当然是错误的） @导入'C:/My Source/angular component library/src/theme/variables' partials/imp

Hybris默认支持“.less”为店面生成css文件。除此之外，hybris还集成了后台sass 后台sass集成链接： 无店面集成链接： 我想从“\u ui-src”文件夹中的scss文件生成“\u ui”文件夹中的css文件。如何为店面执行scss集成？Grunt还支持scss格式。您可以修改Gruntfile.js以添加scss文件。您可以尝试ant clean build？它与“ant clean build”无关。当我们构建系统时，hybris从_ui-src生成_ui文件夹。u

有没有办法在不使用Sass选项的情况下生成JHipster项目，并在以后添加它 我曾尝试通过“.yo rc.json”启用它，然后运行“jhipster upgrade--force”，但它没有启用它。这里有一种方法可以做到这一点，同时使用git保留自定义代码 假设您在master上的工作代码（您可以创建一个分支进行实验），创建一个git分支来添加saas git checkout -b add-saas Modify.yo-rc.json，使用jhipster--with entities重

我有svg图像，每个图像都有不同的大小，但我要寻找的最终结果是，所有卡的大小都相同，剩余的空间——给图像 图像应该用剩余的高度填充高度，宽度可以保持“自动”或图像，例如50px，但要使其垂直对齐：中间它（Ionic helpers在这里不起作用..） 我有一个stackblitz的例子： home.ts Ionic 2-具有不同img大小但大小相同的卡 九寸钉子还活着 有史以来最受欢迎的工业集团 负责将音乐带给大众观众。 九寸钉子还活着 有史以来最受欢迎的工业集团 负责将音乐带给大众观众

有没有办法在scss文件中启用intellisense？我正在将变量导入到我的项目中，效果很好，但每次我都必须转到_variable.scss文件，看看我在那里写了什么，因为它并不是建议。 我想，您需要在vsCode插件中安装：

我有一个cdn托管的.scss文件，其中包含我需要从代码中访问的sass变量。托管文件基本上如下所示： @import url("http://hostedsite/icon.scss"); @each $icon, $value in map-get($styles, 'icons') { .#{$icon} { &::before { content: $value; } } } 在我的项目中，我希望能够做到以下几点： @import url

我有一些钮扣 <button type="button" class="myButton btn btn-primary">foo</button> <button type="button" class="myButton btn btn-secondary">bar</button> ... 确实如此，但这里我明确地将颜色设置为红色。我想让它动态化，所以在这里使用给定按钮的颜色 更新2: 我想我终于找到了，但是： @each $color,

我有一个链接，我想将文本装饰设置为none。 问题是，当我在SCSS文件中更改它时，它不会更改 如何禁用或覆盖用户代理样式表 我试图检查该网页，但它只是在用户代理样式表中显示了一些样式（覆盖了我的代码） 这是我的代码： .site-name { text-decoration: none; font-size: calc(1rem + 1.2vw); color: white; } …这是用户代理样式表的代码： a { text-decoration: underline;

我正在尝试探索我在互联网站上找到的以下示例。这看起来像是后固定一个符号导致SASS反转嵌套 .MyComponent { &-title { .MyComponent--xmasTheme & { } } &-content { .MyComponent--xmasTheme & { } } } // Compiles to .MyComponent-title {} .MyComponent--xmasThem

根据示例，我创建了一个包含以下文件的项目 // _corners.scss $-radius: 3px; @mixin rounded { border-radius: $-radius; } // style.scss @use "./corners"; .button { @include corners.rounded; } 但是当我用节点sass运行这个时，比如 ./node_modules/.bin/node-sass src/components/test/style.

我正在尝试使用snowpack获得苗条的材质UI。 我已经安装了Snowpack和Snowpacks苗条模板，如下所示： npm安装--保存开发snowpack@next npx创建雪包应用程序xpapp——模板@snowpack/应用程序模板svelte 这样，就会显示“苗条”页面示例。接下来，我按照Svelte Material UI说明“将其捆绑到您自己的代码中”，如此处说明的使用章节所述： 因此，我安装了Sass，并在我的snowpack.config.json文件中对其进行了如下配置

我想创建一个函数，该函数获取两个变量作为输入，如果第一个变量存在，则返回该变量，如果不存在，则返回回退值 我在试这个 @function component-token($token-name, $fallback) { @if variable-exists($token-name) { @return $token-name; } @return $fallback; } 我想把它当作 .my-class { color: component-token($c

我有一个条目文件： @use '_mixins'; @use '_default'; 现在，当我在default.scss中使用mixin时，它抛出错误： Dart Sass失败，错误为：错误：未定义混合 既然鼓励使用@use，我不明白为什么这不起作用。如果我像以前那样编写@import，效果会很好： @import '_mixins'; @import '_default'; 这条路很好，很漂亮 我如何使用@use并仍然拥有所有可用的东西？这可能是因为使用新规则@use对您构建项目结构的方

是否可以使用Compass或SASS输出以下CSS转换，该转换将输出所有不同的供应商前缀： -webkit-transition: all 0.3s ease-in-out; 有人能告诉我正确的图书馆吗？使用： 用于使用单个或“全部”属性转换创建动画的Mixin @include transition(PROPERTY DURATION DELAY(OPT) TIMING-FUNCTION) @mixin transition($transition) { -webkit-transiti

所以我发现我可以在Sass中做数学和分配变量。因此，我开始创建一个延迟例程堆栈，这样我就可以重新定时并将其他css3动画按顺序向前推，而不必一直在页面上下滚动寻找那条愚蠢的行 我知道这不是一个真正的函数，但在大多数情况下它是有效的！一旦安装程序节省了一点时间。但是设置它是最烦人的，如果我改变了我对订单的想法 呸，否则我想为那些搜索相同东西的人分享这段代码片段 $Atime: 2.0s; $Btime: $Atime + 0.2s; $Ctime: $Btime + 1.0s; $Dtime: $

我想创建一个逗号分隔的列表，由空格分隔的列表组成 我希望得到以下元列表：（（12）、（34）） 我不能使用文本，因为元列表应该由存储在变量中的现有列表组合而成。所以我使用append（） 我的问题是append（）打破了第一个列表，产生（1,2,3,4）） 为什么会发生这种情况？如何正确地组装元列表？好的，我知道了 解决方法是首先创建一个空白列表 $meta-list: () $meta-list: append( $meta-list, (1 2), comma) $meta-list: ap

我正在尝试设置一个循环，使用我设置的另一个循环为我定义的每个断点创建一组类。这些是英国石油公司的 $mobileMedium : 480px; $tabletVertical : 768px; $desktopNormal : 1024px; $desktopWide : 1200px; 这是我的SCS @each $bpName in "mobileMedium", "tabletVertical", "desktopNormal", "desktopWide"{ @i

在过去的4个小时里，我一直试图找到一种方法来创建一个带有指南针和sass的sprite图像，它还可以自动缩放每个单独的图像，以便与“背景大小”属性一起使用 我发现什么都不管用，真不敢相信有那么难 有没有人有一个有效的例子 编辑：这是我目前所拥有的 @mixin resize-sprite($map, $sprite, $percent) { $spritePath: sprite-path($map); $spriteWidth: image-width($spritePath

嗨，我不知道为什么SASS会编译像/*第3行，../SASS/style.scss这样的注释*/ 有什么想法吗 SCSS代码 @import 'compass/css3'; nav{ background: #e25555; ul{ @include box-sizing(border-box); } } 编译的CSS /* line 3, ../sass/style.scss */ nav { background: #e25555; } /* line 5,

我正在使用Susy 2，我有以下代码： @include breakpoint($tab) { .l-region--sections { > .block { @include span(6 of 12); &:nth-child(2n) { @include last; } } } } @include breakpoint($desk) { .l-region--sections { &

我已经用bower安装了singularity，并使用Prepos作为编译器 尝试编译my.scss文件时返回以下错误： File to import not found or unreadable: singularitygs 在my styles.scss文件的顶部： @import "compass/reset"; @import "singularitygs"; config.rb： require 'singularitygs' relative_assets = true cs

不需要安装Ruby就可以使用Bourbon及其附加组件吗？我们想在一个小项目上进行实验，但要获得桌面工程人员对依赖项的批准是一件痛苦的事情 我注意到除了苦味酒外，还有适合所有人的凉亭包装。我可以从GitHub抓取scss文件并手动连接吗？最近我在静态站点项目中使用Bourbon/Neat时遇到了同样的问题。我发现'bourbon'和'neat'命令只会将库文件的层次结构复制到项目目录中。此时，您可以将库与任何能够预处理sass/scss文件的工作流一起使用 在我的例子中，我从内部成功地将它们与P

我正在尝试将一些不太重要的内容转换为SASS，我发现了一些很好的文章，介绍了正则表达式搜索和替换的基础知识，但是我发现了很多未捕获的特定语法实例 具体而言： .head-container{ float:left; margin: 0 0 40px 0!important; .article-container-img-head{ .article-container-img; padding-top:0; } } SAS

我正在尝试启动sass函数： $times: 0.10 0.20 0.30 0.40 0.50 0.60 0.70 0.75 0.80 0.90; @each $value in $times{ .is-hidden-#{$value}{ @include hide( $value + s ); } } 问题是：不知何故，它不接受十进制数字。它与1、2、3等完美配合。我甚至尝试过： $times: 10 20 30 40 50 60 70 80 90; @each $val

所以我制作了一个库，我可以使用直接链接安装bower。通过在bower.json文件的依赖项中添加库名，我可以从另一个内部应用程序使用这个库。当其他内部应用程序执行bower更新时，我对库所做的更改将应用于它们的应用程序。这部分工作得很好 现在，我希望其他软件开发人员可以自由更改样式。他们可以直接创建css文件，这将起作用。然而，这是一条黑客路线。我可以为他们提供与我使用的相同的设置文件 因此，我尝试将该文件放在bower.json的主要部分，但wiredep正在处理它。我把它放在exclude

当我尝试使用webpack构建SASS文件时，我遇到以下错误： 未找到模块：错误：无法解析模块“文件加载程序” 请注意，只有当我尝试使用相对路径加载背景图像时，才会出现此问题 这项工作很好： background:url(http://localhost:8080/images/magnifier.png); 这导致了以下问题： background:url(../images/magnifier.png); 这是我的项目结构 图像 风格 webpack.config.js 这

我想更改react select中的multi-select项目的颜色 我可以看到，这里已经记录了这一点 这条线应该能帮我完成任务 @select-item-color: @select-primary-color; 除了我的项目很少使用SCS 有人能告诉我什么是等效的SCSS吗？SCSS变量可以在以下位置找到： scss文件中没有设置原色变量，但是@select item color的scss等价物是$select item color 你可以像这样改变颜色

即使map get中的第一个参数，$breakpoints似乎是一个有效的Sass映射，我也会遇到这个错误 $breakpoints: ( mobile: 320px, tablet: 768px, desktop: 992px ); @mixin break($size) { @media (min-width: map-get($breakpoints, $size)) { @content; } } 一切似乎都很好。SassMesister演示-如何编译sc

我在nativescript cli中使用“tns create my app--template ng”创建了一个nativescript angular应用程序，然后使用“tns platform add android”安装了android平台。然后，应用程序使用“tns run android”在android仿真器上完美运行 为了能够使用SASS进行样式设置，我按照这里的说明进行了操作。这包括安装SASS插件和在app目录中创建基本scss文件。现在，当我尝试运行我的应用程序时，出现以

如何将嵌套的sass映射隔离到新映射中？例如，我有这样的sass映射： $susy-setting: ( s: ( 'columns': 4, 'gutters': 30px, ), m: ( 'columns': 8, 'gutters': 30px, ), l: ( 'columns': 12, 'gutters': 30px, ) ); 然后我需要在循环之后隔离内部的每个映射，因为我的另一个mixin需要映射作为

我需要我的页面在不需要重新加载页面的情况下，为iPhoneX从纵向调整到横向 以下是我使用的媒体查询： // Screen size variables $screen-sm-min: 576px; // Small tablets and large smartphones (landscape view) $screen-lg-min: 992px; // Tablets and small desktops //$screen-lg-min: 1024px; $screen-xl-m

使用多个类选择器嵌套时，是否有一种使用sass根据标记指定样式的方法？例如，如果您有一个泛型类选择器，当它是span或a时，需要对其进行不同的样式设置。像这样的东西（不起作用）： 它适用于类，但对于标记，我找不到方法。可惜的是，有一个css选择器：not（）但没有：is（），这会起作用。我想你离这不远了： .foo>.bar>{ &.项目{ 显示：块； 字号：700； } &span.item{ 颜色：蓝色； } &a.项目{ 颜色：红色； } } 在此处使用代码笔： 下面是一个编译CSS的片

I用于显示开关（复选框、收音机、滑块等）。 我已经有一段时间没有编写html/sass了，我对这一点有点恼火 我以为你不是用点就是用散列。但在这里你两者都用。 这是SASS特有的东西吗？它用变量名替换{$pretty--class name} 我发现这一点： 用户有时希望使用插值来定义变量名 基于另一个变量。Sass不允许这样，因为这样会 很难一目了然地说出哪些变量是在哪里定义的。 不过，您可以做的是定义一个从名称到您需要的值的映射 然后可以使用变量访问 但下面的例子并没有使用相同的方法 $pr

我试图编译一个简单的示例： $font-stack: Helvetica, sans-serif; $primary-color: #333; body { font: 100% $font-stack; color: $primary-color; } 但是，sass会引发错误： Error reading ..\..\..\..\System Volume Information: operation not permitted. 使用的命令是： sass input.scss ou