上一章已經(jīng)簡單介紹了一下常用的css預(yù)處理器Less。本章我們著重講解一下變量有關(guān)知識。
變量命名規(guī)范:
1.必須有 @ 為前綴
2.不能包含特殊字符
3.不能以數(shù)字開頭
4.大小寫敏感
變量的基本使用如圖所示:
除此之外,變量還可以作為插值使用,變量可以用于選擇器名、屬性名、URL、@import語句。
再來介紹一下變量的延遲加載特性:當(dāng)一個變量被聲明多次,會取最后一次的值,并從當(dāng)前作用域往外尋找變量。如以下語句:
編譯后:
.test{
width: 1;
}
.test.one{
height: 3;
}
less中還可以使用屬性名變量,在屬性前加上$符,這個屬性就成了變量,并且可以調(diào)用該屬性的值,如圖:
編譯后
.widget {
color: #efefef;
background-color: #efefef;
}