-
less 中導(dǎo)入less 文件時可以不加擴(kuò)展名 例：@import "style" less 中導(dǎo)入 css 文件時需要加擴(kuò)展名 ：@import (less) "reset.css" @import 寫在哪里，編譯之后 css 內(nèi)容 就會出現(xiàn)在哪里查看全部
-
有時候我們需要輸出一些不正確的CSS語法或者使用一些LESS不認(rèn)識的專有語法。 要輸出這樣的值我們可以在字符串前加上一個 ~ 例如： width:~'calc(100%-35)'; height:~'calc(300px-20px)'; 編譯后(.css文件): width: calc(100%-35); height: calc(300px-20px); !important關(guān)鍵字 會為所有混合所帶來的樣式,添加上!important查看全部
-
@arguments包含了所有傳遞進(jìn)來的參數(shù)。查看全部
-
嵌套規(guī)則 & 代表的它的上一層選擇器查看全部
-
Less中的運(yùn)算 @test_01:300px; .box_02{ width:@test_01 + 20; height: (@test_01 - 200) * 5; background:#ccc - 10; }查看全部
-
注：@_ 意思為不管調(diào)用哪種樣式塊都會加上該樣式塊的樣式。查看全部
-
常規(guī) .sanjiao{ width:0; height:0; overflow:hidden; border-width:10px; border-color: transparent transparent red transparent; border-style: dashed dashed solid dashed; } 匹配模式(類似if) .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(left,@w:5px,@c:#ccc){ border-width:@w; border-color:transparent @c transparent transparent; border-style: dashed solid dashed dashed; } .triangle(right,@w:5px,@c:#ccc){ border-width:@w; border-color:transparent transparent transparent @c; border-style: dashed dashed dashed solid; } .triangle(@_,@w:5px,@c:#ccc){ width:0; height:0; overflow:hidden; } .sanjiao1{ .triangle(right,10px); } demo2: .pos(a){ position:absolute } .pos(f){ position:fixed; } .box{ .pos(f); }查看全部
-
less混合 .box{ background-color:#fff; .border; //引用border樣式 } .border{ border:1px solid red; } 帶參數(shù)的混合 .box{ background-color:#fff; .border_02(5px); } .border_02(@border_width){ border:@border_width solid yellow; } 默認(rèn)混合(不傳入?yún)?shù)則走默認(rèn)值,傳入?yún)?shù)則走傳進(jìn)來的這個值) .border_03(@border_width:10px){ border:@border_width solid green; } .div1{ .border_03();//走的是默認(rèn)值,即10px的邊框 } .div2{ .border_03(15px);//走的是傳遞進(jìn)來的參數(shù),即15px的邊框 }查看全部
-
less 中 用 @符號聲明變量,如： @width：100px; 使用變量，如： div{width:@width}查看全部
-
less文件里面的注釋有兩種。 /**/會被編譯到css文件里邊 //不會被編譯到css文件里邊查看全部
-
輸出方式 normal(不壓縮) compress(進(jìn)行壓縮)查看全部
-
LESS之于CSS，相當(dāng)于jQuery之于JavaScript！ less是一種動態(tài)樣式語言，屬于css預(yù)處理語言的一種，類似于css的語法，為css賦予了動態(tài)語言的特性，如變量、繼承，運(yùn)算，函數(shù)等，更方便css的編寫和維護(hù)查看全部
-
.sanjiao-bottom{ width:0; height:0; overflow:hidden; border-width:10px; border-style: solid dashed dashed dashed; border-color: red transparent transparent transparent }查看全部
-
1.并列嵌套 2.&查看全部
-
1.一般混合 2.帶參數(shù)混合 3.默認(rèn)混合查看全部
舉報
0/150
提交
取消