将 LESS 嵌套 CSS 转换为标准 CSS

Question

我需要帮助尝试将这种 LESS 嵌套 CSS 转换为标准 CSS。有人可以帮忙吗？

.leftNav {
    a.TopLevel {
        float:none;
    }

    ul#topnav {
        > li {
            float:none;
            height: 2em;
            margin: 2px;
            background-color: rgb(1,64,117);
            border: 1px solid rgb(1,64,117);

                color: #fff;
            border-radius: 3px;
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                background: -webkit-gradient(linear, left top, left bottom, color-stop(0.03, rgb(30,94,147)),  color-stop(0.99, rgb(1,64,117)) );
            background: -moz-linear-gradient(center top,  rgb(30,94,147) 3%, rgb(1,64,117) 99% );
        }

        > li .sub {
            left:120px;
            top: 0px;
        }

        > li > h2 > a {
            color: #fff;
        }

        > li:hover > h2 > a, > li > h2 > a:hover, li > h2 > a:focus, a.TopLevel.active, a.TopLevel.active:hover {
            background-position: top left;
            color: #bbb;
        }

        li:hover {

        }
    }

    #topNavContainer {
        position:absolute;
        left: 17px;
        top: 100px;
    }

    .headertable, .wrapper {
        margin-left: 120px;
    }
}

Answer 1

您还可以使用 lessphp 或 less.js。

佩卡是对的。如果您有 LESS 样式（*.less 文件），则还认为您有 LESS 解析器（原始 ruby​​ gem 或 PHP 类之一，甚至 less.js JavaScript 库）及其主要解析器目的是将 LESS 解析（转换）为 CSS。

更新

• WinLESS - (Windows) 非常简单的 GUI。看起来它使用的是
  less.js 不知何故（我个人的选择）
• SimpleLESS - （Multiplarform）另一个 GUI。工作也很好
• LessAPP - (Mac) 我认为它是第一个用于编译的桌面工具之一 * .less 是 WinLESS 和 SinpleLESS 的祖父

还有许多其他工具...适用于 Mac、Win 和 Multi

Answer 2

LESS 的要点在于，您编写 LESS 样式的 CSS，然后 LESS 解释器将其转换为普通 CSS。

因此，只要通过 LESS 运行你的 LESS 代码，你就会得到等效的普通 CSS。

简单的。

Answer 3

使用firebug，在CSS选项卡中，您可以看到使用LESS在css中生成的结果是什么。

Answer 4

您可以使用 LessJS 转换器

Answer 5

检查使用 Simpless 将 Less 转换为 CSS

SimpLESS 是您易于使用的 LESS CSS 编译器。

希望它会对你有很大帮助..

Answer 6

这是使用 Less 最简单的方法：

1. 创建 style.css 文件
2. 创建 style.less 文件

3. 在 index.php 中链接到这些文件：

   请注意，要链接到 less，您应该以 /less 结束 rel=""：

   rel="stylesheet/less"。
   

4. < p>下载http://winless.org/

5. 将您的项目文件夹拖到此程序中，它会将您的 less 文件转换为 css。