Scss List字体面对循环

时间:2019-02-07 09:48:23

标签: list loops sass font-face

我正在尝试使用SCSS在CSS中渲染Webfont字体外观声明。我在列表中为字体系列定义了变量名,并定义了文件名。然后,我在CSS中将变量名称用作占位符。

我在代码中找不到错误。

$fonts: (
"paradise thoughts": paradisethoughts-regular,
"masterblush": masterblush-regular,
"steadfast": steadfast-regular,
"beautiful bloom": beautiful-bloom-regular,
"rosefield": rosefield-regular,
"silverberry": silverberry-regular,
"little bestseller": little-bestseller-regular,
"the saturday": thesaturday-clean-regular,
"smaragdines script": smaragdines-script-regular,
"trendsetter": trendsetter-regular,
"imperfectly": imperfectly-regular,
"summer festival": summer-festival-regular,
"northern lights": northern-lights-regular,
"hello stockholm": hello-stockholm-regular,
"wilderness": wilderness-regular,
"riverside avenue": riverside-avenue-regular,
"perfect sunset": perfect-sunset-regular,
"sugarstyle millenial": sugarstyle-millenial-regular,
);

@each $family, $file in $fonts {
  @font-face {
      font-family: '#{$family}';
      src: url('#{$file}.eot');
      src: local('#{$family} regular'), local('#{$file}'),
        url('#{$file}.eot?#iefix') format('embedded-opentype'),
        url('#{$file}.woff2') format('woff2'),
        url('#{$file}.woff') format('woff'),
        url('#{$file}.ttf') format('truetype'),
        url('#{$file}.svg##{$file}') format('svg');
      font-weight: normal;
      font-style: normal;
      }
  }

谢谢!

0 个答案:

没有答案