一、變數:@定義變數(例如@width)
二、混合(mixins)
.bordered
#menu a
三、巢狀(nesting)
/*將偽選擇器與混合一同使用。下面是乙個經典的 clearfix 技巧,重寫為乙個混合(& 表示當前選擇器的父級):*/
.clearfix
}
四、@規則和冒泡
@ 規則(例如 @media 或 @supports)可以與選擇器以相同的方式進行巢狀。@ 規則會被放在前面,同一規則集中的其它元素的相對順序保持不變。這叫做冒泡
.component
}@media
(min-width
: 1280px)
}
編譯成:
.component
@media
(min-width
: 768px) }
@media
(min-width
: 768px) and (
min-resolution
: 192dpi) }
@media
(min-width
: 1280px)
}
五、運算
算術運算子 +、-、*、/ 可以對任何數字、顏色或變數進行運算。如果可能的話,算術運算子在加、減或比較之前會進行單位換算。計算的結果以最左側運算元的單位型別為準。如果單位換算無效或失去意義,則忽略單位。無效的單位換算例如:px 到 cm 或 rad 到 % 的轉換。
六、轉義
轉義(escaping)允許你使用任意字串作為屬性或變數值。
@min768:(
min-width
: 768px)
;.element
}
編譯成:
@media
(min-width
: 768px)
}
七、函式
例如利用 percentage 函式將 0.5 轉換為 50%,將顏色飽和度增加 5%,以及顏色亮度降低 25% 並且色相值增加 8 等用法:
@base
: #f04615;
@width
: 0.5;
.class
八、命名空間和訪問符
#bundle()
}.tab
.citation
}/*下面把 .button 類混合到 #header a 中,我們可以這樣做:*/
#header a
九、對映
#colors()
.button
編譯成:
.button
十、作用域
less 中的作用域與 css 中的作用域非常類似。首先在本地查詢變數和混合,如果找不到,則從「父」級作用域繼承。
@var
: red;
#page
@var
: white;
}
十
一、注釋
「//」或者「/**/」
十
二、匯入
如果匯入的檔案是 .less 副檔名,則可以將副檔名省略掉
@import
"library"
; // library.less
@import
"typo.css"
;
ubuntu新手入門
ubuntu使用設定之介面篇 ubuntu系統裝好了,不過怎麼看上則呢麼醜醜的?好像mr徐的介面和我的不一樣呢,怎麼設定的呢?首先,讓我們來設定工具條。ubuntu預設2條工具條,讓我們來把他設定成和windows下一樣的吧。先讓我們在上面的工具條的空白的地方,選擇刪除面板。然後,讓我們在底下的面板...
XML新手入門
ibm的xml教程 xml是什麼?xml,或稱為可擴充套件標記語言 extensible markup language 是一種您可以用來建立自己的標記的標記語言。它由全球資訊網協會 w3c 建立,用來克服 html 即超文字標記語言 hypertext markup language 它是所有網頁...
SOA新手入門
什麼是soa 我們可能應該回答的第乙個問題也是最基本的問題。什麼是面向服務的體系結構 service oriented architecture,soa 這個問題的答案實際上涉及與開發相關的若干不同方面。soa 是一種 it 體系結構樣式,支援將您的業務作為鏈結服務或可重複業務任務進行整合,可在需要...