建站
咨詢
售后
建站咨詢
新聞中心
這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
分享一下Sass安裝步驟
Sass 是一款強化 CSS 的輔助工具，它在 CSS 語法的基礎(chǔ)上增加了變量 (variables)、嵌套 (nested rules)、混合 (mixins)、導入 (inline imports) 等高級功能，這些拓展令 CSS 更加強大與優(yōu)雅。使用 Sass 以及 Sass 的樣式庫（如 Compass）有助于更好地組織管理樣式文件，以及更高效地開發(fā)項目
NPM 安裝
我們可以使用 npm（NPM 使用介紹）來安裝 Sass。
npm install -g sass
注：國內(nèi) npm 建議使用淘寶鏡像來安裝，參考：NPM 國內(nèi)慢的問題解決
Windows 上安裝
我們可以使用 Windows 的包管理器 Chocolatey 來安裝：
choco install sass
Mac OS X (Homebrew)安裝
Mac OS 可以使用 Homebrew 包管理器來安裝：
brew install sass/sass/sass
更多安裝方法可以查看官網(wǎng)：https://sass-lang.com/install
使用介紹
我們的教程使用的是 npm 安裝的 sass，安裝完成后可以查看版本：
$ sass –version 1.22.12 compiled with dart2js 2.5.0 接下來我們創(chuàng)建一個 runoob-test.scss 文件，內(nèi)容為： runoob-test.scss 文件代碼:
/* 定義變量與值 */
$bgcolor: lightblue;
$textcolor: darkblue;
$fontsize: 18px;
/* 使用變量 */
body {
background-color: $bgcolor;
color: $textcolor;
font-size: $fontsize;
}
然后在命令行輸入下面命令，即將 .scss 文件轉(zhuǎn)化的 css 代碼：
$ sass runoob-test.scss
@charset "UTF-8";
/* 定義變量與值 */
/* 使用變量 */
body {
background-color: lightblue;
color: darkblue;
font-size: 18px;
}
我們可以在后面再跟一個 .css 文件名，將代碼保存到文件中：
$ sass runoob-test.scss runoob-test.css
這是會在當前目錄下生存 runoob-test.css 文件，代碼如下：
@charset "UTF-8";
/* 定義變量與值 */
/* 使用變量 */
body {
background-color: lightblue;
color: darkblue;
font-size: 18px;
}
/*# sourceMappingURL=runoob-test.css.map */
網(wǎng)站欄目：分享一下Sass安裝步驟
網(wǎng)頁網(wǎng)址：http://www.dlmjj.cn/article/djcooch.html
