一、sass
1.解決中文報錯
????在ruby中找到engine.rb文件,在該文件require?xxx?后邊寫上:
????Encoding.default_external?=?Encoding.find('utf-8')
2.作用域?qū)旌弦约袄^承的影響
????sass中:
????????1)定義在作用域內(nèi)部的混合,在外部無法訪問,只能在內(nèi)部訪問
????????2)定義在作用域內(nèi)部的繼承,在作用域外部是可以訪問的,不管該選擇器寫在任何位置,都可以被繼承到
????less中:
????????1)less的混合與sass的繼承比較像,less定義在作用域內(nèi)部的混合,外部不能直接訪問,需要通過命名空間進(jìn)行訪問
????????2)less的方法和sass的混合比較像,less定義在作用域內(nèi)部的方法,在外部不能直接訪問,需要通過命名空間
3.占位符
????我們自定義一個選擇器樣式,用于繼承,繼承結(jié)束,我們不想要這個選擇器了骂维,刪掉它
????此時可以使用占位符,表示定義一組臨時屬性,當(dāng)編譯結(jié)束就會被刪除
????占位符只能用于標(biāo)簽選擇器,其他選擇器不能用
????語法:
????%div{}
????%mydiv{}
4.數(shù)字運算
????Sass中也有加減乘除運算,可以進(jìn)行數(shù)字航闺、變量之間的運算,可以帶單位運算
????帶有單位運算時:默認(rèn)是px,哪個單位在前邊,最終就以那個單位為標(biāo)準(zhǔn)
????除法有點特殊:
????1)加上()
????2)變量或者是函數(shù)的返回結(jié)果
????3)除法運算只是表達(dá)式的一部分
????滿足以上任何一個條件都可以
5.色彩運算
????sass中支持色彩的加減乘除,注意除法要滿足上邊的數(shù)學(xué)運算中的條件
????16進(jìn)制的色彩運算,每個通道進(jìn)行獨立運算,如果十六進(jìn)制色彩每個通道的值大于255或小于0潦刃,不會影響其他通道,大于255取255乖杠,小于0取0
????在rgba模式下,進(jìn)行運算時,要求透明度必須一致,否則無法運算,最終結(jié)果不會影響透明度
6.插值與字符串拼接
????????插值:為了動態(tài)創(chuàng)建屬性
????????語法:
????????#{$dir}
????????字符串拼接:
????????+?拼接兩個字符串,沒有''
????????no?+?-repeat
????????$re:-repeat
????????no?+?$re;
7.
????語法:
????@if?定義if語句
????@else?if?定義else?if語句
????@else?定義else語句
????or?或?and?與?not?非
????判斷相等使用:==
????<=?>=?<?>
8.for循環(huán)
????語法:
????@for?$i?from?start?through?end{
????//循環(huán)體
????}
????@for:定義for循環(huán)
????$i:循環(huán)變量
????start:$i的初始值,包括start
????end:$i的結(jié)束值,包括end
????from:從哪里開始
????through:到哪里結(jié)束
9.while循環(huán)
????語法:
????@while?條件{}
????$i?:?0;
????@while?$i?<?20{
????//循環(huán)體
????$i:$i+1;
????}
10.三元運算符
????if(條件,true結(jié)果執(zhí)行,false結(jié)果執(zhí)行)