Ionic framework 没有名为Rtable cell的mixin--SCS中的灯光错误
我有一个ionic应用程序,它有一个page.html,我试图将这个sass代码应用到我的flexbox表中,但无法编译。我有这个css样式的背景颜色Ionic framework 没有名为Rtable cell的mixin--SCS中的灯光错误,ionic-framework,sass,Ionic Framework,Sass,我有一个ionic应用程序,它有一个page.html,我试图将这个sass代码应用到我的flexbox表中,但无法编译。我有这个css样式的背景颜色 .Rtable-cell--light { background-color: white; border-color: m
.Rtable-cell--light {
background-color: white;
border-color: mix(white,$tableColour,80%);
}
我在我的Rtable手机里用include调用它
.Rtable-cell {
box-sizing: border-box;
flex-grow: 1;
width: 100%; // Default to full width
padding: 0.8em 1.2em;
overflow: hidden; // Or flex might break
list-style: none;
border: solid $bw white;
background: fade(slategrey,20%);
> h1, > h2, > h3, > h4, > h5, > h6 { margin: 0; }
margin: -$bw 0 0 -$bw; //border collapse offset
@include Rtable-cell--light;
}
为什么我会得到错误
我的flexbox表看起来像这样
<div class="Rtable Rtable--4cols">
<div class="Rtable-cell"><h3>Eddard Stark</h3></div>
<div class="Rtable-cell">Has a sword named Ice</div>
<div class="Rtable-cell">No direwolf</div>
<div class="Rtable-cell"><strong>Lord of Winterfell</strong></div>
<div class="Rtable-cell"><h3>Jon Snow</h3></div>
<div class="Rtable-cell">Has a sword named Longclaw</div>
<div class="Rtable-cell">Direwolf: Ghost</div>
<div class="Rtable-cell"><strong>Knows nothing</strong></div>
<div class="Rtable-cell"><h3>Arya Stark</h3></div>
<div class="Rtable-cell">Has a sword named Needle</div>
<div class="Rtable-cell">Direwolf: Nymeria</div>
<div class="Rtable-cell"><strong>No one</strong></div>
</div>
</div>
您使用了错误的关键字。 .Rtable cell light不是mixin,而是选择器,因此您应该使用@extend而不是@include,如:
@extend .Rtable-cell--light;
文档链接:文档似乎指向了错误的部分链接似乎在那里工作不正常,但您可以找到扩展/继承部分:如果Rtable cell light仅用作模板,则更好的做法是避免在这种情况下创建单独的CSS规则。我会尽快阅读更多的sass文件