- 語言特性
- LESS - 巢狀規則
- LESS - 巢狀指令和冒泡
- LESS - 運算
- LESS - 轉義
- LESS - 函式
- LESS - 名稱空間和訪問器
- LESS - 作用域
- LESS - 註釋
- LESS - 匯入
- LESS - 變數
- LESS - 擴充套件
- LESS - 混合宏
- LESS - 引數化混合宏
- LESS - 混合宏作為函式
- LESS - 向混合宏傳遞規則集
- LESS - 匯入指令
- LESS - 匯入選項
- LESS - 混合宏保護
- LESS - CSS 保護
- LESS - 迴圈
- LESS - 合併
- LESS - 父選擇器
- 函式
- LESS - 其他函式
- LESS - 字串函式
- LESS - 列表函式
- LESS - 數學函式
- LESS - 型別函式
- LESS - 顏色定義函式
- LESS - 顏色通道函式
- LESS - 顏色運算
- LESS - 顏色混合函式
- 用法
- LESS - 命令列用法
- 在瀏覽器中使用 LESS
- LESS - 瀏覽器支援
- LESS - 外掛
- LESS - 程式化用法
- LESS - 線上編譯器
- LESS - 圖形使用者介面
- LESS - 編輯器和外掛
- LESS - 第三方編譯器
- LESS - 框架
- LESS 有用資源
- LESS - 快速指南
- LESS - 有用資源
- LESS - 討論
LESS - 獲取單位函式
描述
get-unit 函式返回其單位,其中引數包含數字和單位。如果引數不包含任何單位,則返回空值。
示例
以下示例演示了在 LESS 檔案中使用 get-unit:
misc_example.htm
<!doctype html>
<head>
<link rel = "stylesheet" href = "style.css" type = "text/css" />
</head>
<body>
<div class = "list">
<h2>Welcome to TutorialsPoint</h2>
<p>The largest Tutorials Library on the web.</p>
</div>
</body>
</html>
接下來,建立 style.less 檔案。
style.less
.list {
font-size:get-unit(30px);
padding-left:get-unit(25);
}
您可以使用以下命令將 style.less 檔案編譯為 style.css:
lessc style.less style.css
執行上述命令;它將自動建立包含以下程式碼的 style.css 檔案:
style.css
.list {
font-size: px;
padding-left: ;
}
輸出
請按照以下步驟檢視上述程式碼的工作原理:
將上述 html 程式碼儲存在 **misc_example.htm** 檔案中。
在瀏覽器中開啟此 HTML 檔案,將顯示以下輸出。
less_misc_functions.htm
廣告