CSS의 기본 선택자는 무엇입니까?

CSS의 기본 선택기는 다음을 포함하여 HTML 문서의 요소를 일치시키는 데 사용됩니다. 유형 선택기(클래스 이름 일치); ID 선택기(ID 일치); 하위 요소 inside), 하위 요소 선택자(직접 하위 요소와 일치), 인접 형제 선택자(바로 인접한 형제 요소와 일치), 범용 형제 선택자(모든 형제 요소와 일치), 속성 선택자(지정된 특성 요소와 일치)

CSS의 기본 선택기

CSS의 기본 선택기는 HTML 문서의 요소를 일치시키는 데 사용됩니다. 이러한 선택기를 사용하면 특정 요소에 대한 스타일을 지정할 수 있습니다.

유형 선택기

• 요소: 지정된 요소 이름을 가진 모든 요소와 일치합니다. 예를 들어 p는 모든 단락을 의미합니다. element：匹配带有指定元素名的所有元素，例如 p 表示所有段落。

类选择器

• .class-name：匹配具有指定类名的所有元素，例如 .example 表示所有带有 example 类的元素。

ID 选择器

• #id-name：匹配具有指定 ID 的单个元素，例如 #header 表示带有 header ID 的元素。

后代选择器

• ancestor descendant：匹配位于祖先元素内的后代元素，例如 ul li 表示所有位于 ul 元素内的 li 元素。

子元素选择器

• parent > child：匹配作为父元素直接子元素的子元素，例如 div > p 表示所有直接位于 div 元素内的 p 元素。

相邻兄弟选择器

• element + adjacent：匹配直接出现在指定元素之后的相邻元素，例如 p + h2 表示所有直接位于 p 元素之后的 h2 元素。

通用兄弟选择器

• element ~ sibling：匹配所有出现在指定元素之后的兄弟元素，包括相邻元素和更远的元素，例如 h1 ~ p 表示所有位于 h1 元素之后的 p 元素。

属性选择器

• [attribute]：匹配具有指定属性的元素，例如 [href] 表示所有具有 href 属性的元素。
• [attribute=value]：匹配具有指定属性并具有指定值的元素，例如 [href="example.com"] 表示所有 href

🎜클래스 선택기🎜🎜🎜🎜.class-name: 지정된 클래스 이름을 가진 모든 요소와 일치합니다. 예를 들어 .example은 가 있는 모든 요소를 ​​의미합니다. 예제 클래스의 요소. 🎜🎜🎜🎜ID 선택기🎜🎜🎜🎜#id-name: 지정된 ID를 가진 단일 요소와 일치합니다. 예를 들어 #header는 header ID의 요소입니다. 🎜🎜🎜🎜Descendant selector🎜🎜🎜🎜<code>ancestorDescendant: 조상 요소 내에 있는 하위 요소와 일치합니다. 예를 들어 ul li는 ul 요소 내의 <code>li 요소입니다. 🎜🎜🎜🎜Child element selector🎜🎜🎜🎜parent > child: 상위 요소의 직계 하위인 하위 요소와 일치합니다. 예를 들어 div > p는 모두 div 요소 내에 있는 직접 A p 요소입니다. 🎜🎜🎜🎜인접 형제 선택기🎜🎜🎜🎜요소 + 인접: p + h2와 같이 지정된 요소 바로 뒤에 나타나는 인접 요소와 일치합니다. 이는 모두 직접 p 요소 뒤에 오는 code>h2 요소입니다. 🎜🎜🎜🎜범용 형제 선택기🎜🎜🎜🎜요소 ~ 형제: h1 ~ p와 같은 인접 요소 및 추가 요소를 포함하여 지정된 요소 뒤에 나타나는 모든 형제 요소와 일치합니다. code>는 h1 요소 뒤에 오는 모든 p 요소를 나타냅니다. 🎜🎜🎜🎜속성 선택기🎜🎜🎜🎜[속성]: [href]와 같이 지정된 속성이 있는 요소와 일치합니다. 이는 href가 있는 모든 요소를 ​​의미합니다. > 요소의 속성입니다. 🎜🎜[attribute=value]: 지정된 속성과 지정된 값을 가진 요소를 일치시킵니다. 예를 들어 [href="example.com"]는 모든 를 의미합니다. href 속성 값이 "example.com"인 요소입니다. 🎜🎜

위 내용은 CSS의 기본 선택자는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!