时间戳

首页 > 解决方案 > \@ 媒体查询上的符号及其解释方式

css - \@ 媒体查询上的符号及其解释方式

问题描述

我目前正在学习 SASS，并且在实用程序地图示例中遇到了“\@”符号，如下所示：

@each $name, $breakpoint in $breakpoints {
@media(min-width: $breakpoint) {
  **.text-size-#{$size}\@#{$name}** {
    font-size: #{$size}px;
  }
}}

它为各种断点创建字体大小并编译为如下内容：

...
@media (min-width: 412px) {
  .text-size-12\@small {
    font-size: 12px;
  }
}

@media (min-width: 768px) {
  .text-size-12\@medium {
    font-size: 12px;
  }
}

@media (min-width: 1024px) {
  .text-size-12\@large {
    font-size: 12px;
  }
}
...

在这种情况下，'\@' 符号转换为什么？我是否正确假设这些类将被调用为class="text-size-12 small"？

标签： csssass

解决方案

推荐阅读