0

我只是学得少了。我有这样的html文件

<!DOCTYPE HTML>
<html lang="en-IN">
<head>
  <meta charset="UTF-8">
  <title>.::LESS::.</title>
  <link rel="stylesheet" type=text/css"" href="style.less" />
  <script type="text/javascript" src="less.js"></script>
</head>
<body>
  <div class="box1">This is box1</div>
  <div class="box2">This is box2</div>
  <div class="box3">This is box3</div>
</body>
</html>

我的style.less文件是这样的

@blue : #00c;
@light-blue: @blue + #333;
@deep-blue: @blue - #333;
.box1 {
  background-color: @blue;
}
.box2 {
  background-color: @light-blue;
}
.box3 {
  background-color: @deep-blue;
}

但是毕竟这当我要检查html page from the browser它时没有显示任何东西。如果我changing the values of background-color要检查,any color values那么背景颜色可以在那里看到。有人可以告诉我错误的部分在哪里吗?欢迎任何帮助和建议。提前致谢。

4

2 回答 2

1

您缺少 # 表示浅蓝色。这是应该看起来的样子吗?

于 2012-08-07T09:39:08.467 回答
0

您的代码正确编译为

.box1 {
  background-color: #00c;
}
.box2 {
  background-color: #3333ff;
}
.box3 {
  background-color: #000099;
}

但是,您编写的以下行:

<link rel="stylesheet" type=text/css"" href="style.less" />

应该:

<link rel="stylesheet/less" type="text/css" href="style.less" />

试试这个并再次检查它是否有效。

于 2012-08-07T10:03:53.237 回答