我在Sass筑巢时遇到了麻烦.说我有以下HTML:
<p href="#" class="item">Text</p>
<p href="#" class="item">Text</p>
<a href="#" class="item">Link</a>
当我尝试在下面嵌套我的样式时,我得到一个编译错误:
.item {
color: black;
a& {
color:blue;
}
}
当父选择器是同一元素的一部分时,如何在父选择器之前引用类型选择器？
我正在尝试在我的变量上使用字符串插值来引用另一个变量:
// Set up variable and mixin
$foo-baz: 20px;
@mixin do-this($bar) {
width: $foo-#{$bar};
}
// Use mixin by passing 'baz' string as a param for use $foo-baz variable in the mixin
@include do-this('baz');
但是当我这样做时,我收到以下错误:
未定义的变量:"$ foo-".
Sass是否支持PHP风格的变量变量？
我使用Font Awesome Sass文件https://github.com/FortAwesome/Font-Awesome/blob/master/sass/font-awesome.sass使它成为_font-awesome.sass所以我可以@import在我的Sass项目中.我也在使用http://middlemanapp.com/将Sass转换为Css.问题:
有没有办法只将已使用的图标类带入我转换后的.css？因为现在它带有_font-awesome.sass的所有类
奖励:是否可以使用已使用的图标类以某种方式重新编译字体,以使其在生产使用中更小？
如果我能得到上面#1的一些提示,那就太棒了.
谢谢.
所以,我有一个app/assets/stylesheets/看起来像这样的目录结构:
|-dialogs
|-mixins
|---buttons
|---gradients
|---vendor_support
|---widgets
|-pages
|-structure
|-ui_elements
在每个目录中,有多个sass partials(通常是*.css.scss,但是一个或两个*.css.scss.erb).
我可能会假设很多,但rails应该自动编译那些目录中的所有文件,因为*= require_tree .在application.css中,对吧？
我最近尝试通过删除所有颜色变量并将它们放在根app/assets/stylesheets文件夹(_colors.css.scss)中的文件中来重构这些文件.然后我在app/assets/stylesheets名为master.css.scss 的根文件夹中创建了一个文件,如下所示:
// Color Palette
@import "colors";
// Mixins
@import "mixins/buttons/standard_button";
@import "mixins/gradients/table_header_fade";
@import "mixins/vendor_support/rounded_corners";
@import "mixins/vendor_support/rounded_corners_top";
@import "mixins/vendor_support/box_shadow";
@import "mixins/vendor_support/opacity";
我真的不明白rails如何处理资产编译的顺序,但它显然不利于我.看来没有一个文件意识到他们有任何变量或mixins被导入,所以它抛出错误,我无法编译.
Undefined variable: "$dialog_divider_color".
(in /home/blah/app/assets/stylesheets/dialogs/dialog.css.scss.erb)
Undefined mixin 'rounded_corners'.
(in /home/blah/app/assets/stylesheets/widgets.css.scss)
该变量$dialog_divider_color在_colors.css.scss中明确定义,并_master.css.scss导入颜色和我的所有mixins.但显然铁路没有获得那份备忘录.
有什么方法可以解决这些错误,还是我需要将所有变量定义放回每个单独的文件,以及所有mixin导入？
不幸的是,这家伙似乎并不认为这是可能的,但我希望他错了.任何想法都非常感谢.
在SASS中,是否可以从另一个目录导入文件？例如,如果我有这样的结构:
- root_directory
- sub_directory_a
- _common.scss
- template.scss
- sub_directory_b
- more_styles.scss
template.scss可以导入_common.scss,@import "common"但是more_styles.scss可以导入_common.scss吗？我尝试了一些不同的东西,包括@import "../sub_directory_a/common"和@import "../sub_directory_a/_common.scss",但似乎没有任何工作.
这可能是指南针101,但是有没有人写过mixin来设置颜色的alpha值？理想情况下,我希望mixin采用任何形式的颜色定义,并应用透明度:
@include set-alpha( red, 0.5 ); //prints rgba(255, 0, 0, 0.5);
@include set-alpha( #ff0000, 0.5 ); //prints rgba(255, 0, 0, 0.5);
@include set-alpha( rgb(255,0,0), 0.5 ); //prints rgba(255, 0, 0, 0.5);
我正在努力设置libsass,因为它不像基于Ruby的转换器那样直截了当.有人可以解释如何:
我对包管理器的经验很少,对于任务运行者来说更是如此.
在VS <= 2015中,我们可以使用WebEssentials扩展,负责为我们编译less/sass文件,但目前它不支持VS 2017.您是否知道类似的扩展可以编译更少/ sass在构建？
我刚刚关注了Sass教程.由于某种原因虽然Sass文件没有正确生成css.终端说css无效,但我很确定它不是.我已经尝试过更改它以防万一有问题...
我做错了什么？
Sass版本:Sass 3.1.10
错误信息:
error sass/test.sass (Line 3: Invalid CSS after "80%":
expected expression (e.g. 1px, bold), was ";")
.sass文件内容:
/* style.scss */
#navbar {
width: 80%;
height: 23px;
}
我已经开始尝试使用Sass进行css工作了.在我的Css文件所在的目录中,我也看到了'.sass-cache'文件夹.任何人都可以告诉我为什么这个文件夹被创建,如果我删除它是安全的.
谢谢,