Question

我不知道为什么但是在用grunt或任何东西进行编译时会出现一个名为invalid property name的错误

#flotTip {
    border: none !important;
    font-size: $font-size-small !important;
    line-height: 1px !important;
    @extend .tooltip-inner() !important; 
}

在行高的上面代码中，它产生一个未定义的属性。我的任务是将所有较少的文件转换为sass文件。据我所知，使用了许多解决方案将所有这些解决方案转换为sass。但是这个我找不到任何解决方案。任何人都可以回答可能出现的问题吗？

Answer 1

line-height: 1px !important;行看起来不错。问题出在以下几行。如果您尝试包含mixin，请使用@include，不要将mixin的名称加上.（点）前缀。另外，请勿将!important放在其后。

Answer 2

Extend仅用于扩展简单选择器，如class，element或id。您无法将!important与@extend一起使用。这是使用extend的正确方法：

.foo {
    color: red;
}

#flotTip {
    @extend .foo; 
}

你可能会感到困惑，混乱扩展与mixins，也不能使用!important。这是使用mixins的正确方法：

@mixin foo() {
    color: red;
}

#flotTip {
    @include foo(); 
}

Answer 3

我猜您错误地使用了@extend。请参阅此处的文档：http://sass-lang.com/documentation/file.SASS_REFERENCE.html#how_it_works

使用grunt编译sass会产生无效的属性名称

3 个答案: