CSS 포맷터

混乱되거나 압축된 CSS를 일관된 들여쓰기와 구조로 정리합니다. 복사 또는 다운로드하세요.

입력
1
출력
1
0 문자 0 줄

CSS 포맷터

이 도구는 CSS 코드에 적절한 들여쓰기, 줄 바꿈, 일관된 포맷을 추가하여 아름답게 정리합니다. 압축되었거나 잘못 포맷된 CSS를 붙여넣으면 깔끔하고 읽기 쉬운 출력을 얻을 수 있습니다.

조작은 브라우저에서 로컬로 실행됩니다. 데이터는 업로드되지 않으며 서버에 저장되지 않습니다.

사용 방법

  1. CSS 코드를 입력 편집기에 붙여넣으세요.
  2. CSS 포맷을 클릭하여 코드를 정리합니다.
  3. 포맷된 CSS가 적절한 들여쓰기와 함께 출력 편집기에 표시됩니다.
  4. 복사로 클립보드에 복사, 다운로드로 파일 저장, 또는 지우기로 초기화하세요.

CSS 포맷팅이란?

CSS 포맷팅은 CSS 코드에 들여쓰기와 줄 바꿈을 추가하여 사람이 읽을 수 있게 합니다. 압축된 CSS는 파일 크기를 줄이기 위해 모든 공백이 제거되어 읽기 어렵습니다.

CSS 포맷팅은 스타일 디버깅, 프레임워크 검토, 다른 개발자와의 협업에 필수적입니다.

입력 참고사항

이 도구는 모든 CSS 입력을 허용합니다. 포맷터는 모든 스타일과 선택자를 보존하고 가독성을 위해 공백과 들여쓰기만 변경합니다.

예시

압축된 CSS는 포맷 후 읽기 쉬워집니다:

--- Minified Input ---
body{margin:0;padding:0;font-size:16px;}.container{max-width:1200px;}

--- Beautified Output ---
body {
  margin: 0;
  padding: 0;
  font-size: 16px;
}

.container {
  max-width: 1200px;
}