Less-comments
提供:Dev Guides
少ない-コメント
説明
コメントにより、コードがユーザーにとってわかりやすく理解しやすくなります。 コードではブロックスタイルとインラインコメントの両方を使用できますが、LESSコードをコンパイルすると、CSSファイルに単一行のコメントは表示されません。
例
次の例は、LESSファイルでのコメントの使用を示しています-
<html>
<head>
<title>Less Comments</title>
<link rel = "stylesheet" type = "text/css" href = "style.css"/>
</head>
<body>
<h1>Example using Comments</h1>
<p class = "myclass">LESS enables customizable,
manageable and reusable style sheet for web site.</p>
<p class = "myclass1">It allows reusing CSS code and
writing LESS code with same semantics.</p>
</body>
</html>
ここで、_style.less_ファイルを作成します。
style.less
/*It displays the
green color!*/
.myclass {
color: green;
}
//It displays the blue color
.myclass1 {
color: red;
}
次のコマンドを使用して、_style.less_ファイルを_style.css_にコンパイルできます-
lessc style.less style.css
次に、上記のコマンドを実行します。それは次のコードで自動的に_style.css_ファイルを作成します-
style.css
/*It displays the
green color!*/
.myclass {
color: green;
}
.myclass1 {
color: red;
}
出力
上記のコードがどのように機能するかを確認するには、次の手順に従ってください-
- 上記のHTMLコードを commentsl ファイルに保存します。
- このHTMLファイルをブラウザで開くと、次の出力が表示されます。