- 語言特性
- 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 - 圖片高度函式
描述
它檢查檔案中的影像高度。
示例
以下示例演示了在 LESS 檔案中使用影像高度的方法:
<!doctype html>
<head>
<link rel = "stylesheet" href = "style.css" type = "text/css" />
</head>
<body>
<h2>Welcome to TutorialsPoint</h2>
<h3>The largest Tutorials Library on the web.</h3>
</body>
</html>
接下來,建立 style.less 檔案。
style.less
body {
background-image:url("startup.jpg");
height:image-height("startup.jpg");
}
您可以使用以下命令將 style.less 檔案編譯為 style.css:
lessc style.less style.css
執行上述命令;它將自動建立 style.css 檔案,其中包含以下程式碼:
style.css
body {
background-image: url("startup.jpg");
height: 800px;
}
輸出
按照以下步驟瞭解上述程式碼的工作原理:
將上述 html 程式碼儲存在 misc_example.htm 檔案中。
在瀏覽器中開啟此 HTML 檔案,將顯示以下輸出。
less_misc_functions.htm
廣告