Less選擇器- Less教學 - 億聚網

LESS is a CSS pre-processor that enables customizable, manageable and reusable style sheet for web site. LESS is a dynamic style sheet language that extends the ... 億聚網課程目錄首頁文章聯繫我們SearchLess教程Less教學Less安裝Less嵌套規則Less運算符Less轉義Less函數Less命名空間和訪問器Less作用域Less註釋Less導入Less變量概述Less選擇器LessURLsLessimport語句Less變量插值屬性Less變量插值Less變量名Less變量延遲加載Less缺省變量Less變量Less經典用例Less合併風格及高級混入Less擴展附加到選擇器Less擴展內部規則集Less擴展嵌套選擇器Less使用擴展精確匹配Lessnth表達式Less擴展allLess選擇器插值擴展Less作用域及擴展@mediaLess重複檢測Less擴展Less不輸出混合類型Less在混合類型的選擇器Less混合命名空間Less守護命名空間Less!important關鍵字Less混合類型LessMixins使用多參數Less命名參數Less@arguments變量Less高級參數和@rest變量Less模式匹配Less參數化混合Less混合作用域LessMixin和返回值Less混合在另一個混合中Less混合作爲參數Less傳遞規則集到混合Less導入指令Less導入選項reference關鍵詞Less導入選項inline關鍵詞Less變量概述LessURLsLess選擇器瀏覽人數：329最近更新：2020年10月13日選擇器可以引用任何變量，它是在編譯時構建的。

變量名稱必須放在花括號內({})前綴爲@符號。

示例 下面的例子演示瞭如何使用選擇器在Less文件： LESSselectors WelcometoYiibaiYiibai LESSisaCSSpre-processorthatenablescustomizable,manageableandreusablestylesheetforwebsite. LESSisadynamicstylesheetlanguagethatextendsthecapabilityofCSS.LESSisalsocrossbrowserfriendly. 接下來，創建文件 style.less。

style.less @selector:h2; @{selector}{background:#2ECCFA;} 你可以編譯 style.less 使用下面的命令來生成 style.css 文件： lesscstyle.lessstyle.css 接着執行上面的命令，它會自動創建 style.css文件，下面的代碼： style.css body{background:#2ECCFA;} 輸出 讓我們來執行以下步驟，看看上面的代碼工作： 保存上述的HTML代碼到 less_variables_interpolation_selectors.html文件 。

在瀏覽器中打開該HTML文件，得到如下輸出顯示。

ShareFacebookTwitterEmailLess變量概述LessURLs0條評論，你可以發表評論，我們會進行改進提交