less.js輸出css的檢視方法：先新建一個HTML文檔，並引入less.js和main.less文件；然後開啟瀏覽器進行存取；最後按F12開啟【開發者工具】，並選取對應的DOM元素即可在右側看見編譯後的css程式碼。
本教學操作環境：Windows7系統、less2.6.0&&Chrome76.0&&CSS3版本，此方法適用於所有品牌電腦。
推薦：《css影片教學》
less.js輸出css怎麼查看？
查看less.js輸出css程式碼的步驟：
1、首先我們新建一個HTML文檔，並引入less.js和main.less文件
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet/less" href="main.less">
</head>
<body>
<div class="app">app</div>
<script src="less.min.js"></script>
</body>
</html>main.less
@width: 100px;
@height: 200px;
.app{
width: @width;
height: @height;
background: skyblue;
}註：link標籤的rel屬性，改成stylesheet/less
2、然後開啟瀏覽器進行訪問，按F12開啟開發者工具，選取對應的DOM元素，即可在右側看見編譯後的css程式碼
註：需要將index.html、main.less、less .js檔案放在web伺服器中才能運作（我們可以用相關軟體搭建本機web環境，推薦phpStudy V8）
以上是less.js 輸出css怎麼查看的詳細內容。更多資訊請關注PHP中文網其他相關文章！
