CSS 압축도구

카테고리 : 웹툴/티스토리

원본 CSS

압축 CSS




CSS 압축하기

흔한 툴 중 하나이다.

CSS 압축을 하는이유는 네트워크 용량감소(요즘에는 거의 없다.) + 읽기 불편하게정도(css는 뷰티파이어로 한눈에 볼수있다)뿐이다.


아쉽지만 요즘에는 거의 사용할 이유는 없다.

이유는 웹서버(Apache,Nginx 등)에서 충분히 압축을 한뒤(gzip) 사용자에게 전송된다.

서버와 브라우저가 사용하는 압축기술을 STRING인 CSS파일에서 사용할수는 없다.

minify를 해도 단지 목적은 /* */ 같은 주석제거 정도가 되지않을까 싶다.


CSS 팁

1. 양수(+) 소수는 0을 안붙여도 된다. (예: opacity:0.5 -> opacity:.5)

2. 세미콜론(;)은 Array join 처럼 마지막에 안붙어도 된다. (예: div{color:#222;margin:0;} -> div{color:#222;margin:0})

3. @import는 link보다 느릴수밖에 없다. (link태그는 웹브라우저가 태그를 읽는 순간, @import는 style이 로딩된 이후 실행됨)

4. JS에서만 구현해봤을 기능을 할수있는 attr() 기능도 사용할 수 있다.(IE8+)

 

저작권 보호안내
무단 전재, 재배포 행위는 금지됩니다. (글을 복사하여 게시금지)
본문의 일부(링크용 문장) 인용은 가능하지만, 출처와 링크(a 태그)를 남기셔야 됩니다.
(웹툴을 이용하고, 스크린샷/녹화하는것은 상관없습니다.)

예외적으로. 저에게 허락받은 경우에는 본문을 전재할 수 있습니다.

만약, 본문 공유를 원하신다면 링크 공유를 해주세요

저작권 정책 확인하기
링크 공유하기

 댓글