Sass 无效 CSS:预期表达式(例如 1px、粗体)为“{”

2024-02-14

我有以下 Sass,以下这个例子是@each http://sass-lang.com/documentation/file.SASS_REFERENCE.html#each-directive:

@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');
  }
}

这只是回答另一个问题的一个例子。在 CodePen 中,它给了我一个错误:

“USA、EUR、JPN”后的 CSS 无效:预期表达式(例如 1px、粗体)为“{”

这是 CodePen 上的示例 https://codepen.io/mrengy/pen/GqXqgV?editors=1100.

这个错误没有任何意义。这里有什么问题?


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

要使其像 SASS 一样工作,您需要去掉大括号、分号并添加一些空格。

这是更正后的代码:

@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 https://codepen.io/vic3685/pen/akaEyo?editors=1100

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Sass 无效 CSS:预期表达式(例如 1px、粗体)为“{” 的相关文章

  • 删除特定数据表上的所有边框

    我需要使用 PrimeFaces 隐藏一个数据表的所有边框 而不是全部 我尝试了很多事情 但没有人奏效 有谁知道该怎么做 我已将以下样式 单独 应用于ui datatable class border hidden important bo
  • 使用 python 在一个 html 页面中显示分割数据框的 HTML 代码

    我是 html css 新手 所以对以 html 格式显示的数据有疑问 我有一个很长的列表 我想将其拆分并以 html 格式显示为两个单独的列 例如 而不是 Col1 Col2 1 a 2 a 3 a 4 a 5 b 6 b 7 b 8 b
  • Sass:@use 出错,未定义变量

    我正在使用 Sass 并且想要使用 use关键字而不是 import 因为 import有很多问题 另外只有dart sass支持这个功能 我将node sass改为dart sass 然而 问题出现了 我原来的代码 import carb
  • 如何使使用 css 调整大小的图像在 IE 中看起来不错?

    当使用 css 宽度 高度或属性宽度 高度缩放图像时 IE6 和 IE7 无法很好地缩放网页中的图像 我不确定它默认使用哪种算法 但这不好 在这些浏览器中缩放时 缩放图像会显示锯齿伪影 幸运的是 有一种方法可以通过简单的 css 规则强制
  • CSS 到底如何计算相对尺寸

    我想更好地理解某些 CSS 行为 这与具体问题无关 我只是在调试网站时遇到的 让我们在固定位置的 div 中放置一个全宽图像 div img style width 100 src https via placeholder com 150
  • Webpack 4:如何使用 LESS 获取 CSS 源映射?

    多年来我一直在尝试让 CSS 源映射在 webpack 中工作 但没有成功 我不确定链条中哪里出了问题 我希望有人能指出我正确的方向 这是发生的事情 行号是错误的 实际上文件名也是错误的 main less只是包含一堆 import也就是说
  • css3按钮背景颜色无限过渡

    有没有办法仅使用 css3 使按钮的背景颜色从灰色渐变为蓝色 然后又回到灰色 一个很好的例子是默认操作按钮是可可 我知道这可以在 javascript 中完成 但我宁愿只使用 css 来完成此操作 您好 我已经通过 CSS3 动画制作了按钮
  • 如何检测一个或多个 JS/CSS 库加载失败(例如 CDN)?

    Premise 我找到了这两个答案 但我不明白如何将它系统地应用于许多库 检测并记录外部 JavaScript 或 CSS 资源加载失败的情况 https stackoverflow com questions 5683824 detect
  • IE 11 中的 CSS Display Flex 无法正常工作,图像会溢出

    我正在使用 CSSdisplay flex 以某种方式显示它们 在 Chrome 中 它看起来很完美 很漂亮 但在 IE 中 图像超出了我放置它们的元素 https jsfiddle net m42k7Lk5 8 https jsfiddl
  • Safari 中的 css3 边框半径动画过渡不起作用

    尝试在 Safari 中对图像的边框半径进行 css3 轻松过渡 它只是有点闪烁进入悬停状态 而不是平滑过渡 任何帮助深表感谢 我的代码如下 CSS all a hover img webkit border radius 50 moz b
  • 先按行再按列布局 div

    我有一个容器div and 3 div里面如下 div div 1 div div 2 div div 3 div div 不知道每一个的内容div内部 但它们的高度和宽度是可变的 集装箱的高度由最高的决定div inside 我想展示这些
  • 如何在有序列表中组合数字和字母?

    如何在 CSS 中用数字和字母递增有序列表 ol nested margin bottom 0 counter reset item ol nested li display block position relative ol neste
  • @media语法/可能的组合

    我见过其中一些 media print media screen handheld print projection media all media all and property value media screen and prope
  • 使用 css 简单地将对象居中,无需修改

    我想使用 CSS 将对象居中 而不需要任何技巧 这可能吗 如何实现 我已经尝试过了 但是我的 p 标签消失了 centered position fixed top 50 left 50 有多种方法可以使元素居中 但这取决于您的元素是什么以
  • 将图像作为框架放置在 iframe 周围?

    我有一个网站尝试以移动格式显示 但在宽屏幕上 我确信 iframe 是正确的选择 我正在尝试将 iframe 加载到 iPhone 的图像中 你可以看一个例子here http webfro gs south tour iframe tes
  • 响应式图像 - srcset 和尺寸属性 - 如何正确使用两者:基于设备像素比和基于视口的选择一起?

    到目前为止 我经常读到这个问题 并且它也发生在我自己的项目中 这里介绍一下我到目前为止所发现的关于 srcset 和 size 属性的内容 关于如何使用有两种不同的可能性srcset 属性 来源 w3c http w3c github io
  • CSS 类命名约定

    在网页上 有两个控件块 主要和次要 大多数人会使用什么类名 选择一 div class primary controls div
  • 使用 CSS 使一行 div 高度相同

    我有一排必须具有相同高度的 div 但我无法提前知道该高度可能是多少 内容来自外部源 我最初尝试将 div 放置在封闭的 div 中并将它们向左浮动 然后我将它们的高度设置为 100 但这没有明显的效果 通过将封闭 div 的高度设置为固定
  • CSS3 信封形状

    正如您可能已经猜到的 该图像是邮件信封形状的一部分 如果可能的话 我想使用 CSS3 创建该形状 我已经制作了其他部分 但这个很棘手 该形状需要两侧都有三角形切口和圆角 大概是 border radius bottom left borde
  • CSS溢出文本显示在几行中,没有断字

    我有一些长文本显示在 div 中 该 div 具有固定的宽度和高度 我希望文本显示在几行上 作为 div 高度 并且句子单词不会中断 一行中的单词前缀和下一行中的继续 此外 我想在末尾添加省略号最后一句话 CSS white space n

随机推荐