Sass“未能@extend”错误 - 无法扩展导入的css类

时间:2016-05-24 01:42:29

标签: css sass compass-sass

错误的jsbin演示

http://jsbin.com/xurufa/2/edit?html,css,output

Line 4: ".testIcon" failed to @extend ".fa"

.scss文件:

@import "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css";

.testIcon {
  @extend .fa, .fa-camera-retro;
}

html

<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Admin Site CSS">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>

</head>
<body>

<i class="testIcon"></i>

</body>
</html>

正在成功导入.fa.fa-camera-retro类,因为您可以通过注释掉@extend行并将html更改为:

来验证
<i class=".fa .fa-camera-retro"></i>

问题

鉴于课程存在,我想知道@extend无法正常工作,以及如何使其发挥作用?

1 个答案:

答案 0 :(得分:0)

下载文件,将扩展名更改为SCSS / SASS然后导入相同或者您也可以使用scss文件来下载