CSSカスケードの確認

같은 속성에 규칙이 여럿 걸릴 때 브라우저가 고르는 순서는?

• 순서 → 특정성 → 중요도
• 특정성 → 중요도 → 순서
• 중요도 → 특정성 → 순서
• 파일 이름 순

.btn.primary 의 특정성은?

• 0,1,0
• 0,2,0
• 1,1,0
• 0,0,2

:where(.card) .title 의 특정성은?

• 0,2,0
• 0,0,1
• 1,0,0
• 0,1,0

미디어 쿼리 아래에 같은 특정성의 기본 규칙을 쓰면?

• 미디어 쿼리가 더 강해서 항상 이긴다
• 둘 다 적용돼 값이 합쳐진다
• 기본 규칙이 이겨서 모바일에서도 기본값이 적용된다
• 선언 순서가 잘못돼 파싱 오류가 난다

그리드 자식이 display: none 이 되면?

• 그리드에서 아예 빠져서 다음 자식이 앞 칸으로 밀려 들어간다
• 그 칸이 빈 채로 남아 자리를 지킨다
• 칸 개수가 자동으로 하나 줄어든다
• 다른 자식 위치는 그대로 유지된다

커스텀 프로퍼티가 SCSS 변수와 다른 결정적 지점은?

• 컴파일 결과가 더 빨라진다
• 런타임에 살아 있어 하위 트리에서만 덮어쓸 수 있다
• 숫자·색 같은 타입 검사가 있다
• 구형 브라우저 지원 범위가 더 넓다

상속으로 받은 값과 그 요소에 직접 걸린 규칙이 부딪히면?

• 직접 걸린 규칙이 항상 이긴다
• 특정성이 높은 쪽이 이긴다
• 상속받은 값이 이긴다
• 나중에 선언된 쪽이 이긴다

!important 를 쓰기 전에 확인할 것이 아닌 것은?

• 선택자가 그 요소에 맞는가
• 다른 규칙에 지고 있는가
• 특정성인가 순서인가
• 파일 크기가 큰가