CSS 선택기에서 HTML 클래스 이름이 중요합니까: 대소문자 구분 설명?

CSS 선택기에서 HTML 클래스 이름은 대소문자를 구분합니까?

CSS 선택기는 일반적으로 대소문자를 구분하지 않습니다. 즉, 클래스 및 ID 선택기 이름의 대소문자에 관계없이 요소를 일치시킬 수 있습니다. 그러나 HTML 클래스 이름 자체는 대소문자를 구분하므로 제공된 예에서 불일치가 발생합니다.

지정된 선택기 .holiday-type.Selflaughter에서는 대문자 "를 사용합니다. 클래스 이름 "Self Catering"의 S"는 HTML 요소의 클래스 이름인 "Self Catering"(소문자)과 일치하지 않습니다. 따라서 스타일이 적용되지 않습니다.

이 동작은 속성 정의에 정의된 대로 HTML 클래스 이름의 대소문자 구분으로 인해 발생합니다. CSS 선택기의 대소문자 구분에도 불구하고 선택기와 HTML 요소 간의 대소문자 불일치로 인해 선택기가 일치하지 않습니다.

선택기의 대소문자 구분은 문서 언어의 영향을 받는다는 점에 유의하는 것이 중요합니다. HTML의 경우 선택기의 요소 이름, 속성 이름 및 속성 값은 대소문자를 구분합니다. 즉, .Self Catering 및 [class~="Self Catering"]과 같은 선택기는 HTML 요소를 "Self Catering" 클래스와 일치하지만 .SelfCatering 및 [class~="SelfCatering"]은 일치하지 않습니다.

문서 유형에서는 클래스 이름을 대소문자를 구분하지 않고 정의했으며 선택기는 대소문자에 관계없이 일치합니다. 그러나 HTML에서는 클래스 이름이 대소문자를 구분하여 문서 언어와의 일관성을 보장합니다.

위 내용은 CSS 선택기에서 HTML 클래스 이름이 중요합니까: 대소문자 구분 설명?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!