LESS 사용 시 에디트플러스에서 CSS 설정 및 구문강조 사용하기

지운아빠

프로필 보기 이 회원 글보기

· 12년 전 · 조회 4565 4565 · 댓글 6 6

드디어 냑도 반응형 웹 작업에 박차를 가하기 위해 LESS 를 도입했습니다.

LESS 도입으로 더 빠르고 안전한 작업이 이루어졌으면 좋겠네요.

그런데 LESS 파일을 에디트플러스에서 여니, 흰것은 배경이요 검은것은 글씨더라가 되더라는 겁니다.

CSS 구문강조에 익숙해져 있는 제 저급한 눈은 이런 환경을 견딜 수가 없습니다.

그래서 설정을 조금 바꿔 보기로 합니다. 천천히 따라오세요. 금방 할 수 있습니다.

우선 설정하기 전에 LESS 파일을 불러왔을 때의 모습을 먼저 살펴보겠습니다.

아 가뜩이나 일하기 싫은데 더 일하기 싫게 만드는 비주얼이네요.

다음은 우리가 흔히 보는 CSS 파일을 불러왔을 때의 모습입니다.

화사한 봄처녀 같은 비주얼의 CSS 구문강조

지금부터 하려는 것이 바로 위의 칙칙한 모습을 아래와 같이 밝고 화사하게 만들어주는 일입니다.

1. 문서 (D) > 영구적인 설정 (P) > 기본설정 대화상자

2. 항목 (C) 에서 파일 > 설정 & 구문강조 선택 파일종류에서 추가 버튼 클릭

3. 설정 & 구문강조 대화상자에서 파일 종류 설명 입력 에 LESS 입력 후 확인 (다른 이름으로 하셔도 됩니다.)

4. 기본설정 대화상자에서 파일확장자에 less 입력 (똑같이 하셔야 합니다.)

5. 설정 및 구문강조 탭에서 구문파일 입력 [...] 버튼 클릭

6. 파일 선택 대화상자에서 css.stx 열기

7. 기본설정 대화상자에서 적용 후 확인 클릭

8. 아름다운 LESS 구문강조 확인하기

짜잔!

동일한 방법을 응용하시면 LESS 파일 뿐만 아니라 어떤 파일이라도 원하는 구문강조를 이용하실 수 있습니다.

캄사합니다.

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 6개

지운아빠

프로필 보기 이 회원 글보기

12년 전

구문강조를 적용하면 button, pre, all 같은 건 빨갛게 표시되네요.

화랑댐

프로필 보기 이 회원 글보기

12년 전

오 감사합니다

takumi22

프로필 보기 이 회원 글보기

11년 전

감사용

웹이지

프로필 보기 이 회원 글보기

11년 전

와우... 감사합니다... ^^

helptiz

프로필 보기 이 회원 글보기

11년 전

와우! 감사합니다~

sure

프로필 보기 이 회원 글보기

11년 전

sublime text 2 추천드려요. 플러그인 설치하면 less포맷 컬러 지원해줍니다.

게시글 목록

번호	제목	글쓴이	조회	날짜
27182	그누보드하고 워드프레스하고 어떤것을 사용하는게 좋을지 궁금합니다. 2	gender	1,066	12년 전
27176	웹접근성을고려한신기술콘텐츠제작기법-javascript,flex,flash를중심으로 5	지운아빠	1,307	12년 전
18634	OS 작지만 강한 우분투 기반 서버솔루션 zentyal 1	미스티아이드	3,452	12년 전
5442	쉘 오류 ?? ㅠㅠ	견해	689	12년 전
18632	PHP getcwd 를 이용한 디렉토리명 가져오기 1	미스티아이드	2,194	12년 전
18629	JavaScript 주민번호, 외국인번호 검사 스크립트 2	라이브러리	4,871	12년 전
5435	간단한 진단지 공개소스가 있을까요? 6	대근	647	12년 전
18627	Mobile Base64.java 파일입니다. 1	누메40	3,835	12년 전
18626	기타 원의방정식을 이용한 거리 구하는 함수	누메40	1,016	12년 전
18623	Mobile [안드로이드] 이미지뷰에 url줘서 링크 걸어주기 2	누메40	3,746	12년 전
5409	일부 환경에서만 제 사이트가 심각하게 느립니다.;;; 25	견해	899	12년 전
18621	MySQL Mysql Text필드 1	맑은별2	1,761	12년 전
18617	PHP 어떤 스마트폰에서 접속했는지 코드 3	맑은별2	915	12년 전
18615	Mobile [안드로이드] 프리퍼런스 사용 방법 1	누메40	2,141	12년 전
18614	Mobile [안드로이드] assets 폴더안에 db 파일 자신 앱에 복사하기	누메40	7,928	12년 전
18608	웹서버 Apache 속도 향상을 위한 mod_pagespeed 모듈 5	흥힝힝	1,912	12년 전
27162	background-position 에 어떻에 대응하십니까?? 13	Faceissue	1,699	12년 전
18607	Mobile [ios]사진촬영후 이미지 편집 샘플입니다.	누메40	1,519	12년 전
5405	궁금한게 있는데요.. 서버에 질문 합니다. 3	누메40	582	12년 전
18606	JavaScript Html , javascript , css 강좌 사이트 입니다.	누메40	2,100	12년 전
18605	JavaScript 주민번호 자바스크립트 체크	프로맘보	1,835	12년 전
5401	서버 호스팅샀는데요~~ 셋팅어떻게해야할까요?? 3	데브타워	622	12년 전
27152	div의 목적이 뭘까요? 9	모노폴리	1,187	12년 전
5397	게시판을 개발하려고 합니다... 고수님들 질문드릴게요 3	벌스	606	12년 전
18603	jQuery 안녕하세요 jquery에 대해 물어볼게있습니다 1	웹boy	895	12년 전
27144	웹접근성 세미나 몰래 다녀왔어요~ 7	퍼블리	1,179	12년 전
20667	정규표현식 정규표현식 의 핵심. 의미있는 메타 문자들 마지막 16	유창화	3,565	12년 전
20666	정규표현식 설문조사 진행 중입니다. ~1월 28일까지	지운아빠	2,106	12년 전
24485	기획의 중요성 5	이천이지	2,292	12년 전
20651	정규표현식 쉬어가는 페이지 > 정규표현식은 왜 알아야 하고 필요한가? 14	유창화	3,661	12년 전
20632	정규표현식 정규표현식 의 핵심. 의미있는 메타 문자들 3 18	유창화	3,467	12년 전
20620	정규표현식 정규표현식 의 핵심. 의미있는 메타 문자들 2 11	유창화	3,126	12년 전
20607	정규표현식 정규표현식 의 핵심. 의미있는 메타 문자들 1 12	유창화	3,998	12년 전
18602	PHP UTF-8에서 문자열을 문자 단위로 나눠서 배열로 저장하기	편리	1,006	12년 전
30749	기타 크로스브라우징? 이제 크롬에서 하나로 확인하자 17	지운아빠	5,969	12년 전
5396	네임서버 설치 도중에 에러가 뜨는데... 뭐가 문제일까요?	쿠로리	1,357	12년 전
18601	Mobile [안드로이드] 자신의 폰에 깔려있는 앱들 검색하기	누메40	1,205	12년 전
18599	Mobile [안드로이드] 이미지 사진 카메라 촬영후 자르고 회전하기. 1	누메40	3,390	12년 전
18596	Mobile [IOS]아이폰 4 , 5 해상도 자동 맞추는 샘플 입니다. 2	누메40	3,021	12년 전
20590	정규표현식 정규표현식 관련 내장함수 preg_match 16	유창화	5,177	12년 전
18589	PHP 방문자의 실제 IP 알아내기 6	흥힝힝	2,688	12년 전
18587	PHP Facebook Page 정보 알아내기 1	흥힝힝	3,317	12년 전
18586	PHP 간단하게 트위터 팔로워 수 구하기	흥힝힝	1,007	12년 전
18585	기타 .htaccess 를 이용하여 쿠키 사용못하게 하기	흥힝힝	838	12년 전
18584	PHP request 가 ajax 인지 확인하는 코드	흥힝힝	2,009	12년 전
5387	하이브리드앱 솔류션을 만들었는데... 8	늘푸른등불	802	12년 전
27106	div 마진 값이 않먹는데요 좀 알려주세요 13	웹디자인되고파	2,207	12년 전
18583	Mobile [ios] 자신의 어플리케이션 폴더안에 파일들 검색! 하기	누메40	1,500	12년 전
18580	MySQL phpMyAdmin 에서 icon 과 text 중 icon 만 보이게 하기 2	관리자	1,100	12년 전
18579	Mobile [iOS]아이폰 DOCUMETN 안에 파일들 Icloud 맊기..(안맊음 리젝 당함)	누메40	2,093	12년 전
27120	utf8, Euc-kr 어떤걸 선호하시나요? 9	Stiven	2,307	12년 전
18574	PHP php 정규식 매뉴얼입니다. 4	프로프리랜서	1,306	12년 전
18570	PHP ereg_replace 정규식입니다. 3	프로프리랜서	778	12년 전
18566	JavaScript 자바스크립트에서 새창 띄우기입니다. 3	프로프리랜서	1,324	12년 전
18562	PHP 문자열자르기소스입니다. 3	프로프리랜서	816	12년 전
18558	PHP 숫자금액을한글로바꾸기입니다. 3	프로프리랜서	1,203	12년 전
26490	기타 웹기획자의 역할과 정의, 업무범위는 어디까지 인가요? 5	구래구래	3,847	12년 전
30733	웹접근성 자바스크립트를 끈 로그인 폼 15	지운아빠	3,937	12년 전
18554	JavaScript 에디터 글양식 변경 기능 문의 3	보충수업	1,359	12년 전
20572	정규표현식 정규표현식의 기본구조 17	유창화	6,968	12년 전
20541	정규표현식 정규표현식 강좌를 시작하며..... 30	유창화	7,545	12년 전
5377	결국 안드로이드 웹뷰로 앱을 다시 만들었네요 9	진서기	2,299	12년 전
18553	OS 리눅스 MySQL DB 백업 스크립트	리아s	3,853	12년 전
5373	이게 개발자영역인지 디자이너 영역인지 잘몰라서 여기서 좀 여쭤보려고하는데요요 좀도와주세요..ㅠㅠ. 3	smwkd	625	12년 전
20534	썸네일 언샵마스크효과 추가 6	유창화	3,648	12년 전
20531	썸네일 원격이미지 썸네일 기능 추가 2	유창화	3,475	12년 전
20527	썸네일 워터마크 함수 기능 보강 및 종합 썸네일함수 버그 수정 3	유창화	2,707	12년 전
20525	썸네일 종합 썸네일 함수 만들기 1	유창화	2,810	12년 전
20519	썸네일 이미지에 워터마크 처리하기 추가 및 워터마크 처리함수 만들기 5	유창화	2,350	12년 전
20513	썸네일 정의한 함수 수정 및 내용 정리 5	유창화	2,259	12년 전
20507	썸네일 이미지에 워터마크 처리하기 5	유창화	5,161	12년 전
20503	썸네일 기준점에 따른 이미지 크롭(이미지의 특정 부분만 복사) 처리하기2 3	유창화	2,796	12년 전
20496	썸네일 기준점에 따른 이미지 크롭(이미지의 특정 부분만 복사) 처리하기1 6	유창화	3,119	12년 전
20490	썸네일 이미지 리사이즈 처리를 위한 함수 만들기 5	유창화	2,241	12년 전
20483	썸네일 원본이미지를 정비율로 리사이즈 처리하기 6	유창화	6,823	12년 전
20471	썸네일 이미지 처리에 필요한 기본함수 만들기 11	유창화	2,556	12년 전
20464	썸네일 이미지 복사하기 6	유창화	3,412	12년 전
20447	썸네일 이미지관련 내장함수 image_type_to_extension, image_type_to_mime_type 16	유창화	2,310	12년 전
20419	썸네일 이미지관련 내장함수 getimagesize 27	유창화	4,804	12년 전
20405	썸네일 이전에 썸네일 관련으로 연재 했던 강좌를 새로 올립니다. 13	유창화	3,671	12년 전
30729	기타 HTML5 기반 에니메이션 제작을 위한 Adobe Edge 3	흥힝힝	2,538	12년 전
18549	Mobile 유투브 api 실행 결과를 담는 방법요? 3	지러유	2,216	12년 전
18544	MySQL 테이블에서 원하는 글(양이 많을때)들을 한번에 삭제하는방법이 있을까요? 4	Rockg	1,275	12년 전
32084	센스리더 센스리더 문제해결 1	지운아빠	3,415	12년 전
32083	센스리더 센스리더 Windows 설정하기	지운아빠	4,076	12년 전
32082	센스리더 센스리더 기능키 리스트	지운아빠	3,441	12년 전
32081	센스리더 센스리더 인터넷의 활용 (가상커서)	지운아빠	5,322	12년 전
30728	CSS IE6/7 img px 버그	daro	1,644	12년 전
27097	html5 작업하실 때 outliner도 돌려보시나요? 8	지운아빠	1,263	12년 전
18537	jQuery JQUERY로 제작된 슬라이드 메뉴입니다. 6	port	5,156	12년 전
27092	아.. 스크립트+jquery...ㅠㅠ 4	조박사님	928	12년 전
32080	센스리더 센스리더의 점자정보단말기 지원 기능 - 3. 씽크 브레일	지운아빠	3,395	12년 전
32079	센스리더 센스리더의 점자정보단말기 지원 기능 - 2. 한소네 브레일	지운아빠	3,396	12년 전
32078	센스리더 센스리더의 점자정보단말기 지원 기능 - 1. Braillenote	지운아빠	2,980	12년 전
32077	센스리더 센스리더의 기능과 기능키 - 19. 기타 기능	지운아빠	3,335	12년 전
32076	센스리더 센스리더의 기능과 기능키 - 18. 위치 정보 관련 기능	지운아빠	2,855	12년 전
32075	센스리더 센스리더의 기능과 기능키 - 17. 숫자 입력 관련 기능	지운아빠	2,835	12년 전
32074	센스리더 센스리더의 기능과 기능키 - 16. 블럭 관련 기능	지운아빠	2,856	12년 전
32073	센스리더 센스리더의 기능과 기능키 - 15. 찾기 관련 기능	지운아빠	2,850	12년 전
32072	센스리더 센스리더의 기능과 기능키 - 14. 객체 레이블 관련 기능	지운아빠	2,872	12년 전

이전 다음

20 21 22 23 24

전체 목록