도구 실행
CSS 포맷터는 복잡하거나 한 줄로 압축된 스타일시트 코드를 읽기 쉽게 정리하고 들여쓰기를 정렬하는 도구입니다. 코드 서식 정리 모드에서는 선택자와 속성 선언마다 줄바꿈을 넣고 지정한 공백 수(0~8칸, 기본값 2칸)에 맞춰 규칙적으로 들여씁니다. 반대로 코드 압축 모드를 선택하면 주석과 불필요한 공백, 중괄호 및 세미콜론 주변의 여백을 제거하여 전체 용량을 줄입니다. 최대 1,000,000바이트 크기의 스타일시트 입력을 지원하며, 작업 실행 후 변환된 코드와 입력 및 출력 크기를 즉시 확인할 수 있습니다.
사용 방법
- 입력창에 정리할 CSS 스타일시트 코드를 입력하거나 붙여넣습니다.
- 원하는 들여쓰기 공백 수(0에서 8 사이 정수)를 지정합니다.
- 가독성을 높이려면 정렬 모드를, 파일 용량을 줄이려면 압축 모드를 선택합니다.
- 실행 버튼을 눌러 변환된 결과를 확인하고 완성된 스타일시트 코드를 복사합니다.
예시
- 한 줄로 이어진 `body { margin: 0; padding: 0; }` 코드를 들여쓰기 2칸 정렬 모드로 변환하여 속성별로 줄바꿈된 가독성 높은 구조로 정리합니다.
- 주석과 여백이 많은 여러 줄의 CSS 스타일시트를 압축 모드로 변환하여 주석과 공백을 제거한 경량화 코드로 축소합니다.
자주 묻는 질문
들여쓰기 간격은 최대 몇 칸까지 설정할 수 있습니까?
들여쓰기는 0칸부터 8칸까지 정수로 지정할 수 있습니다. 범위를 벗어난 값을 입력하거나 비워둘 경우 기본값인 2칸이 적용됩니다.
코드 압축 모드에서는 어떤 부분이 변경됩니까?
블록 주석과 불필요한 줄바꿈이 제거되며, 중괄호, 세미콜론, 콜론 주변의 여백이 축소되어 파일 크기를 최소화합니다.
빈 텍스트를 입력하고 실행하면 어떻게 됩니까?
내용이 비어 있거나 공백만 입력된 경우에는 빈 결과 문자열이 반환되며 입력과 출력 크기는 모두 0바이트로 표시됩니다.