CSS 명시도 계산기
CSS 선택자의 명시도 점수를 계산하고 비교합니다. 스타일 우선순위를 이해하여 CSS 구조를 개선하세요.
🎯
선택자를 추가하여 명시도를 비교하세요
명시도 읽는 법
인라인
style 속성을 통한 직접 스타일링
ID
#id로 대상 지정
클래스 / 속성 / 의사 클래스
.class, [attr], :hover 등으로 대상 지정
요소 / 의사 요소
div, p, ::before 등으로 대상 지정
이 도구 공유
📖
사용 방법
Step 1
선택자 입력
CSS 선택자를 입력합니다
→
Step 2
계산
명시도가 자동으로 계산됩니다
→
Step 3
결과 확인
명시도 값과 비교를 확인합니다
✨
기능
즉시 계산
선택자를 입력하는 즉시 명시도를 계산합니다
선택자 비교
여러 선택자의 명시도를 나란히 비교합니다
시각적 표시
명시도를 (a, b, c)와 막대 그래프로 표시합니다
❓
FAQ
선택자 우선순위를 결정하는 시스템으로, ID > 클래스 > 요소 선택자 순입니다.
🔗관련 도구
🔐
개발자 도구비밀번호 생성기
강력한 랜덤 비밀번호를 즉시 생성합니다. 길이와 문자 유형을 자유롭게 설정할 수 있습니다.
📋
개발자 도구JSON 포맷터 & 검증기
JSON 데이터를 읽기 쉽게 포맷하고 검증합니다. 들여쓰기 조정 및 한 줄 압축(미니파이)을 지원합니다.
🆔
개발자 도구UUID/GUID 생성기
원클릭으로 UUID v4를 생성합니다. 대문자 및 하이픈 옵션으로 최대 100개까지 일괄 생성 가능합니다.
🔗
개발자 도구URL 슬러그 생성기
텍스트에서 SEO 친화적인 URL 슬러그를 생성합니다. 특수 문자를 자동으로 제거하고 음역을 처리합니다.
🕐
개발자 도구Unix 타임스탬프 변환기
Unix 타임스탬프와 사람이 읽을 수 있는 날짜를 상호 변환합니다. 현재 타임스탬프도 즉시 확인할 수 있습니다.
📷
개발자 도구QR 코드 스캐너
업로드한 이미지에서 QR 코드를 읽고 디코딩합니다. URL은 클릭 가능한 링크로 표시되며, 텍스트는 원클릭으로 복사할 수 있습니다.