was css,Sass无效的CSS…:期望的表达式(例如，1px，粗体)，是“{”

I have the following Sass, following this example for @each:

我有以下Sass，以下为@each:

@each $flag in USA, EUR, JPN {

a.#{$flag} {

display:inline-block;

overflow:hidden;

width:0;

height:11px;

padding-left:16px;

background:url('http://res.cloudinary.com/mrengy/image/upload/v1470163121/#{$flag}.gif');

}

}

Its just an example for an answer to another question. In Codepen, it is giving me an error

这只是对另一个问题的回答的一个例子。在Codepen，它给了我一个错误。

Invalid CSS after "USA, EUR, JPN ": expected expression (e.g. 1px, bold), was "{"

在“USA, EUR, JPN”之后，无效的CSS:预期的表达式(例如，1px, bold)是“{”

这是Codepen的例子。

That error makes no sense. What is the problem here?

那个错误毫无意义。这里有什么问题?

1 个解决方案

#1

3

Your code is actually SCSS, not SASS.

你的代码实际上是SCSS，而不是SASS。

To make it work as SASS, you need to get rid of curly braces, semi-colons and add some spaces.

为了让它像SASS一样工作，你需要去掉花括号、分号和添加一些空格。

Here's the corrected code:

这是修正后的代码:

@each $flag in USA, EUR, JPN

a.#{$flag}

display:inline-block

overflow:hidden

width: 0

height: 11px

padding-left: 16px

background: url('http://res.cloudinary.com/mrengy/image/upload/v1470163121/#{$flag}.gif') no-repeat

https://codepen.io/vic3685/pen/akaEyo?editors=1100