Skip to content
created by Aha00aAha00a at 2011-09-07
last modified by Aha00aAha00a at 2021-09-28
revision: 15

Less

Software Source Code

Wikipedia - LESS (stylesheet language)

CSS의 문법을 확장하여 variable을 사용할 수 있고, mixin이라는 개념과 Nesting, Function, Operation을 사용할 수 있다. less를 컴파일하면 css가 나온다.

처음에는 Ruby로 만들어졌으나, 현재는 JavaScript로 재작성 되어서 client-side, server-side 모두 사용할 수 있다.

1. 학습순서

  • Nesting
  • Variables
  • Mixins
  • Operations
  • Functions

2. Usage

less를 설치하고, 명령행에서 다음 명령을 실행하면 컴파일 할 수 있다.

lessc less.less less.css --source-map

이 과정이 불편하므로 최신 IDE에서는 less파일의 수정을 감지하면 자동으로 컴파일 하도록 하는 플러그인들이 있다.

2.1. IDE Support

--2020-07-08

http://leafo.net/lessphp/vim/INSTALL을 참조하여 http://leafo.net/lessphp/vim/less.vim파일을 설치한다.

  • ~/.vim/syntax/less.vim을 복사하고,
  • ~/.vimrcau BufNewFile,BufRead *.less set filetype=less를 추가해 주면 된다.

colorscheme이 제대로 안먹어서 색상은 좀 구린데, set syntax=css보다는 나은 것 같다. Nested rule같은 것도 적용이 잘 되니까..

--2011-09-10


npm install -g less
/usr/local/share/npm/lib/node_modules/less/bin/lessc
/usr/local/lib/node_modules/less/
sudo ln -s /usr/local/bin/node /usr/bin/node

see also WebProgramming

5. See Also

5.2. Similar Pages

Similar pages by cosine similarity. Words after page name are term frequency.

  • Same Wiki
  • Sister Wikis
    • 41.66% AhaWiki:Dev Less less(16:15), html(1:4), 컴파일(2:3), css(3:2), file(3:1), mixins(1:3), content(1:1), map(1:1), intelli(1:1), pages(1:1)

5.3. Adjacent Pages

Control
≤ 32
all
1.0x
1.0x
80
-120
ON
Metrics
Nodes(visible/total)0/0
Links(visible/total)0/0
Avg degree0.00
Depth coverage0
Queue(fetch/graph)0 / 0
Zoom(scale)1.00x
Ctrl/⌘ + Scroll: Zoom
Root 1-hop 2-hop+