이 페이지에서 코드를 어떻게 포맷하나요?
왼쪽 편집기에 코드를 붙여넣거나 파일을 불러온 뒤 필요한 옵션을 선택하고 포맷을 누르세요. 오른쪽에서 결과를 확인한 다음 복사하거나 저장할 수 있습니다.
CSS 포맷터는 압축되었거나 간격이 일정하지 않은 스타일시트를 일관된 들여쓰기와 중괄호, 선택자, 선언, 미디어 쿼리, 중첩 at-규칙을 갖춘 읽기 쉬운 CSS로 정리합니다.
탭이나 공백을 선택하고, 여는 중괄호를 같은 줄 또는 별도 줄에 배치하며, 선택자 목록 분리와 규칙 사이 간격을 설정할 수 있습니다. 문자열 값, 사용자 정의 속성, 주석, 함수 및 데이터 URL은 손상될 수 있는 정규식 치환 없이 파싱됩니다.
압축은 규칙 구조를 바꾸지 않고 불필요한 CSS 공백을 제거합니다. 최적화 및 압축은 호환되는 CSS를 병합하고 재구성해 결과를 더 작게 만들 수 있습니다. CSS 포맷과 압축은 브라우저에서 로컬로 실행됩니다. 변수, 중첩, 믹스인, 함수 등 SCSS 구문에는 SCSS 포맷터 를 사용하세요.
왼쪽 편집기에 코드를 붙여넣거나 파일을 불러온 뒤 필요한 옵션을 선택하고 포맷을 누르세요. 오른쪽에서 결과를 확인한 다음 복사하거나 저장할 수 있습니다.
입력은 선택한 언어나 문법과 일치해야 합니다. 완성되지 않은 문장, 짝이 맞지 않는 괄호나 따옴표, 입력과 다른 방언 또는 모드를 확인한 뒤 다시 실행하세요.
코드 포매터는 언어에 맞는 토큰과 중첩 구조를 인식한 뒤 일관된 규칙에 따라 들여쓰기, 공백, 줄바꿈을 다시 배치합니다. 프로그램을 컴파일하거나 실행하지 않으므로 정확성이나 보안 검사를 대신하지 않습니다.
2칸, 같은 줄의 여는 중괄호, 선택자 분리, 규칙 사이의 빈 줄이 일반적인 웹 규칙입니다. 들여쓰기, 중괄호 스타일, 선택자와 규칙 줄바꿈을 설정한 뒤 포맷, 공백만 제거하는 축소 또는 유효한 CSS의 더 강한 최적화를 선택할 수 있습니다.