Конвертировать вложенный CSS LESS в стандартный CSS - PullRequest
Новая
       4

Конвертировать вложенный CSS LESS в стандартный CSS

0 голосов
/ 04 февраля 2011

Мне нужна помощь, пытаясь преобразовать этот МЕНЬШЕ вложенный 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;
    }
}

Ответы [ 6 ]

10 голосов
/ 04 февраля 2011

Вы также можете использовать lessphp или less.js .

Пекка прав.Если у вас есть стиль (ы) LESS (файл * .less), также считается, что у вас есть LESS-анализатор (оригинальный гем ruby ​​или один из PHP-классов или даже библиотека less.js JavaScript) и его основнойЦель состоит в том, чтобы разобрать (конвертировать) LESS в CSS.

ОБНОВЛЕНИЕ

  • WinLESS - (Windows) довольно простой графический интерфейс.Похоже, что он использует less.js как-то (мой личный выбор)
  • SimpleLESS - (Multiplarform) другой графический интерфейс.Работают также очень хорошо
  • LessAPP - (Mac) Я думаю, что это один из первых Desktop-инструментов для создания * .less Kind of the дедушка из WinLESS и SinpleLESS

Есть много других инструментов ... для Mac, для Win и Multi

6 голосов
/ 04 февраля 2011

Смысл LESS в том, что вы пишете CSS в стиле LESS, а интерпретатор LESS преобразует его в обычный CSS.

Так что просто запустите свой код LESS через LESS, и вы получите эквивалентный обычный CSS.

Simple.

4 голосов
/ 04 февраля 2011

используя firebug , на вкладке CSS вы можете увидеть, что является сгенерированным результатом в css, используя LESS.

3 голосов
/ 01 ноября 2011

Вы можете использовать LessJS Converter

1 голос
/ 04 сентября 2012

Проверка Преобразование Меньше в CSS с Simpless

SimpLESS - ваш простой в использовании компилятор LESS CSS.

Надеюсь, это поможетвас много ..

1 голос
/ 28 марта 2012

Это самый простой способ использовать Less:

  1. Создать файл style.css
  2. Создать файл style.less

  3. В index.php ссылка на этот файл: 

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

    Обратите внимание, что для того, чтобы связать с меньшим, вы должны закончить rel="" с /less: 

    rel="stylesheet/less".

  4. скачать http://winless.org/

  5. Перетащите папку вашего проекта в эту программу, и она преобразует ваш меньший файл в css.
...