이 도구의 기능
CSS Formatter는 Prettier의 PostCSS 구문 분석 플러그인을 통해 규칙, 선언 및 at-규칙을 이해합니다. 간단한 문자 교체로 중괄호를 처리하지 않으므로 문자열, 주석, calc() 및 사용자 정의 속성 값을 구별할 수 있습니다.
- 일반적인 최신 CSS, 미디어 쿼리 및 키프레임을 지원합니다.
- 텍스트 서식만 지정하고 현재 페이지에 스타일을 삽입하지 않습니다.
- 잘못된 구문은 파서 오류를 표시합니다.
사용 방법
- CSS를 붙여넣으세요.
- 들여쓰기 너비를 선택합니다.
- 'CSS 형식'을 클릭하세요.
- formatted.css를 복사하거나 다운로드하세요.
주요 사용 사례
- 한 줄로 되어 있거나 읽기 어려운 스타일시트를 정리하세요.
- 팀 코드 조각 형식을 통합합니다.
- 중첩된 미디어 쿼리와 애니메이션 구조를 관찰하는 데 도움이 됩니다.
CSS Formatter 기능
CSS 선택기, 선언, 미디어 쿼리, 키프레임 및 사용자 정의 속성을 구문 분석하고 아름답게 만듭니다. 일상적인 개발, 디버깅, 데이터 정렬 및 코드 최적화 시나리오에 적합합니다. 처리 결과를 직접 확인, 복사, 다운로드할 수 있습니다.
FAQ
사용자 정의 속성이 잘못 분할됩니까?
파서는 CSS 선언 컨텍스트를 이해하고 일반적인 --custom-property 값을 올바르게 처리합니다.
서식을 지정하면 선택기 효과가 변경되나요?
목표는 레이아웃만 변경하는 것입니다. 그러나 자동화된 도구를 사용하여 처리하기 전에 소스 파일을 유지하고 프로젝트를 테스트하는 것이 좋습니다.
이 페이지에 CSS가 적용되나요?
아니요. 입력과 출력 모두 텍스트 상자에 남아 있습니다.