如何使用考拉编译Sass并将其链接到index.html

Question

我正在学习sass。我正在使用koala将main.scss文件编译为main.css.file但是我的所有样式都没有反映在网页上。也许我得错了

//这是scss文件的一部分

.navbar-brand{
  color: $nav-color;
  font-family: $nav-font;
}

//这就是我在index.html

中链接已编译的css文件的方法

<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="styelsheet" href="css/main.css">
<title>Just Sass</title>

main.css是已编译的文件。

我做错了什么？