-
@arguments用的不是特別多。如果傳入的參數(shù)需要同時變化的時候,可以使用它,會比較便捷。 @arguments包含了所有傳遞進(jìn)來的參數(shù) 如果你不想單獨(dú)處理每一個參數(shù)的話就可以像這樣寫: .border_arg(@w:30px,@c:red,@xx:solid){ border:@arguments; //@arguments可以把你所傳的所有的變量直接帶過來,在這里@arguments,就等于border:@w @c @xx;是一個意思 }查看全部
-
less嵌套規(guī)則 嵌套越多,匹配次數(shù)越多次,所以盡量少嵌套。 .list{ .... li{ .... } a{ &:hover{ color:red } // & 代表上一層選擇器,這里的上一層選擇器是a } }查看全部
-
Less-運(yùn)算 -任何數(shù)字、顏色或者變量都可以參與運(yùn)算,運(yùn)算應(yīng)該被包裹在括號中 例如:加減乘除 @test_01:300px; .box_02{ width:(@test_01-200)*5; //因?yàn)樯厦鍬test_01帶了單位px,所以這里的200就不需要帶單位了 color:#ccc-20; //less會把顏色轉(zhuǎn)為255,然后進(jìn)行加減乘除,實(shí)際工作中顏色運(yùn)算很少用 }查看全部
-
Less-匹配模式 -相當(dāng)于JS中的if,但不完全是 -滿足條件后才能匹配 .sanjiao{ width:0; height:0; overflow:hidden; //這行用來處理IE6最小高度的問題 border-width:10px; border-color:red transparent transparent transparent; border-style:solid dashed dashed dashed; //因?yàn)閎order-style:solid;這樣寫在IE6會有黑底 } //這樣就實(shí)現(xiàn)了一個紅色倒三角 .triangle(top,@w:5px,@c:#ccc){ border-width:@w; border-color:transparent transparent,@c,transparent; border-style:dashed dashed solid dashed; .triangle(bottom,@w:5px,@c:#ccc){ border-width:@w; border-color:@c transparent transparent transparent; border-style:solid dashed dashed dashed; } .triangle(@_,@w:5px,@c:#ccc){ width:0; height:0; overflow:hidden; } .sanjiao{ .triangle(bottom,100px); } 匹配模式-定位例子 .pos(r){ position:relative; } .pos(a){ position:absolute; } .pos(f){ position:fixed; } .pipei{ width:100px; height:100px; .pos(r); }查看全部
-
Less 混合:一個元素引用另一個元素的樣式 1、混合變量 例如:.border{border:solid 10px red;} 如果.div也想用這個樣式直接寫: .div{ .border } 可帶參數(shù) 2.變量沒帶值: .border-radius(@radius){css代碼} .border_02(@border_width){ border:solid yellow @border_width; } .test_hunhe{ .border_02(30px); } 3.變量帶(默認(rèn))值:.border-radius(@radius:5px){css代碼} .border_03(@border_width:10px){ border:solid green @border_width; } .test_hunhe_03{ .border_03(); } 另外,雖然.border-02 和.border-03里面的變量都叫@border-width 但它們不沖突查看全部
-
less中想聲明變量一定要用@開頭 例如:@變量名:值;查看全部
-
Less中的注釋 /**/可以被編譯 //不可以被編譯查看全部
-
Less類似于jquery,是一個庫。 是一種動態(tài)樣式語言,屬于CSS預(yù)處理語言的一種,它使用類似CSS的語法,為CSS賦予了動態(tài)語言的特性,如變量、繼承、運(yùn)算、函數(shù)等,更方便CSS的編寫和維護(hù)。查看全部
-
三角修復(fù):border-style: dashed;查看全部
-
/**/可以被編譯 //不可以被編譯查看全部
-
三角號,原來朝下的話就是上面的顏色是有的,其他是沒有的……兼容ie6的話呢就是把其它的邊設(shè)置為dashed .round{ width: 0; height: 0; overflow: hidden; border-style: dashed solid dashed dashed; border-width: 10px; border-color: transparent red transparent transparent; }查看全部
-
使用lessphp直接調(diào)用less生成css這樣網(wǎng)站維護(hù)更方便。查看全部
-
避免編譯:~''查看全部
-
避免編譯:~''查看全部
-
&代表他的上一層選擇器查看全部
舉報
0/150
提交
取消