CSS "invert" for less

Less (official website here: http://lesscss.net/article/home.html) The charm of the people believe that it is clear that the greatest charm of the individual is that it can clearly show the nesting relationship.

For the existing projects, its application difficulties mainly lie in--

• When to convert to CSS, that is, whether it is conducive to development debugging, is conducive to one-click Deployment

• The existing project is based on CSS, how good to convert the CSS to less, and then maintain less

The first problem is that we can use a conversion tool like winless (http://winless.org/), but there are many other tools like Koala, which also support the conversion of Compass, coffeescript, and Sass, The official website in this koala), everybody chooses to like can.

To solve the second problem here, we know the advantage of less and want to perfect the conversion of CSS to less and achieve the effect of using less to encode the transition.

Css2less use

First taste, visit the online css2less conversion tool URL: http://css2less.cc/--

Next, let's build the css2less of the local environment (equivalent to the build of the css2less environment for remote Linux). Since this library is based on Ruby, let's install Ruby first. It: https://www.ruby-lang.org/en/downloads/, after installation, configure environment variables

My Computer, properties, advanced environment variable, new ruby_home, Value D:[ruby Root]\ruby, and then append to the value of the path variable;%ruby_home%\bin, save it.

Type RUBY-V, Render--

Type GEM-V, Render--

Gem is a standard package for managing Ruby libraries and programs, and it is easy to find, install, upgrade, and uninstall packages through Ruby Gems such as http://rubygems.org/. The Ruby Gem is installed by default in the Ruby1.9.2 version, and if you use a different distribution, please refer to "How to install Rubygem"

Next, install css2less, run--gem install css2less

All gem packages will be installed into the/[ruby root]/lib/ruby/gems/[ver]/directory, which includes the cache, doc, gems, specifications 4 directories, the cache is placed under the download of the native gem package, The gems is placed under the extracted gem package.

OK, we have finished installing the css2less, we can use it immediately. Its command template--

Css2less src_file.css > Desc_file.less

See the effect--

Summarize

Introduction finished css2less use, unfortunately, it does not support batch conversion (and image compression tool Jpegtran, just support single file processing).

Finally, link into Css2less's github address--https://github.com/thomaspierson/libcss2less

Https://github.com/nicooprat/Css2Less This inside also introduced Css2sass, Js2coffee and Html2haml, believe that people who want to use will love them.

CSS "invert" for less