Question

所以我试图在我正在为朋友制作的网站上使用LESS。当我创建一个.less样式表并将其链接到我的html并尝试在我的浏览器本地查看它时，它不会显示我创建的任何样式。但是当我将网站上传到我的本地MAMP服务器并查看它时，它可以工作。这不是一个大问题，我总是可以在我的本地服务器上编辑它，我只是想知道为什么它在我桌面上浏览test.html文件时不起作用。代码是......

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<link rel="stylesheet/less" href="styles.less" type="text/css"/>
<script type="text/javascript" src="less-1.5.0.min.js"></script>
</head>

<body>
<div>
    <header>
        <h1>First LESS Examples</h1>
    </header>

    <div>
        <p>This is some content in the web page.</p>
    </div>
</div>

</body>
</html>

style.less

@baseColor: #535353;

header {
font-family: Arial, Helvetica, sans-serif;
background-color: lighten(@baseColor, 50%);
border: 1px solid darken(@baseColor, 10%);
color: @baseColor;
}

Answer 1

我实际上已经明白了。如果有人想知道这是怎么......

我使用MAMP Pro并将我的根文件夹移动到我的本地主机并在MAMP界面上设置服务器。

然后使用根文件夹位置和URL我在Dreamweaver上创建了一个新站点 - 使其成为测试服务器。

然后我使用CodeKit编译.less文件，因为我在Dreamweaver中创建它们并将它们保存到我的根文件夹。

然后我将生成我的CodeKit的CSS文件链接到index.html页面，现在我能够在Dreamweaver的实时视图和Chrome浏览器上看到更新后的网站，该浏览器会在根目录下自动刷新文件夹在我的本地服务器上更新 - 感谢CodeKit。

LESS仅适用于我的本地MAMP服务器

1 个答案: