sass預處理初入門

2021-07-25 20:20:59 字數 788 閱讀 9027

關於 中文編譯 出錯的問題,需要指定字符集。

@charset

"utf-8";

//必須設定了這個才能編譯有中文的注釋

$fontsize: 12px;

body

/* 測試注釋 */

$side : left;

.rounded -radius: 5px;

}

注釋的問題 ,sass有兩種注釋方式,一種是標準的css注釋方式/* */,另一種則是//雙斜桿形式的單行注釋,不過這種單行注釋不會被轉譯出來。

資料結構 方面,它擁有類似 陣列 的list型別,類似 物件 的map型別

sass的陣列,是通過空格來劃分元素,如果是二維組數,則需要用到小括號與逗號。

//一維陣列

$array: 5px 10px 20px 30px;

//二維陣列

$array2: 5px 10px, 20px 30px;

$array3: (5px 10px) (20px 30px);

sass的陣列有乙個特點,沒有用包起來,也不能用來取其中的某乙個元素,要用需要用到nth內建方法,並且nth與css3的nth-child一樣,是從1開始。

$linkcolor:      #08c

#333

#ccc;a}

//css style

//-------------------------------aa

:hover

SASS 預處理語句

安裝 經過無數次的嘗試後終於成功的安裝了sass到本地版本。v3.4 3 如果還是不成功 瞎子啊乙個cacert.pem到ruby的根目錄下面,然後新增系統的環境變數 ssl cert file carcet.pem的絕對路徑 4 在執行3 一般應該是可以成功的。實現了css的程式設計化 基本語法開...

Sass預處理語言

一種css的預處理器。sass 擴充套件了 css3,增加了規則 變數 混入 選擇器 繼承等等特性。sass 生成良好格式化的 css 易於組織和維護。sass的變數定義格式 變數名 屬性值 預設變數 sass的預設變數僅需要在值後面加上 default即可。特殊變數 如果變數作為屬性則必須要以 形...

css預處理器sass學習

叫做css預處理器,他的基本思想是用一門專門的程式語言來進行頁面樣式的設計,然後在編譯成正常的css檔案。sass的用法 gem install sass使用sass就是普通的文字檔案,字尾名為.scss。然後讓我們用sass的語法寫好檔案之後,需要編譯成.css檔案才能供html檔案使用 即通過l...