CSS에서 일반적으로 사용되는 세 가지 선택기는 1. 요소 선택기, 2. 클래스 선택기, 3. ID 선택기입니다. 자세한 소개: 1. 가장 기본적인 선택자인 요소 선택기는 HTML 요소의 태그 이름에 따라 요소를 선택합니다. 2. 클래스 선택기는 특정 클래스가 있는 요소를 선택하기 위해 사용됩니다. 영숫자 문자로 시작해야 합니다. 3. ID 선택기, 특정 ID가 있는 요소를 선택하려면 "#"을 사용하십시오. 즉, 각 ID는 하나의 요소에만 해당할 수 있습니다.

이 튜토리얼의 운영 체제: Windows 10 시스템, DELL G3 컴퓨터.

CSS에서 일반적으로 사용되는 세 가지 선택기는 다음과 같습니다.

1. 요소 선택기: 가장 기본적인 선택기로서 HTML 요소의 태그 이름을 기반으로 요소를 선택합니다. 예를 들어, p 선택기는 페이지의 모든

요소를 선택합니다.

p {  
  color: red;  
}

위 스타일은 페이지의 모든

요소의 텍스트 색상을 빨간색으로 설정합니다.

2. 클래스 선택기: 클래스 선택기는 특정 클래스가 있는 요소를 선택하는 데 사용됩니다. 클래스 이름은 영숫자 문자일 수 있지만 문자로 시작해야 합니다. 예를 들어, .my-class 선택기는 my-class 클래스가 있는 모든 요소를 ​​선택합니다.

.my-class {  
  background-color: yellow;  
}

위 스타일은 my-class가 포함된 모든 요소의 배경색을 노란색으로 설정합니다.

3. ID 선택기: ID 선택기는 #을 사용하여 특정 ID를 가진 요소를 선택합니다. ID는 고유해야 합니다. 즉, 각 ID는 하나의 요소에만 해당할 수 있습니다. 예를 들어, #my-id 선택기는 ID가 my-id인 요소를 선택합니다.

#my-id {  
  font-size: 20px;  
}

위 스타일은 ID가 my-id인 요소의 글꼴 크기를 20픽셀로 설정합니다.

이 세 가지 선택기는 CSS에서 가장 일반적으로 사용되며 단독으로 사용하거나 조합하여 보다 복잡한 선택 및 스타일을 구현할 수 있습니다.

위의 세 가지 일반적으로 사용되는 선택기 외에도 CSS에는 다음과 같은 다양한 유형의 선택기가 있습니다.

1. 속성 선택기: 이 선택기는 속성과 값을 기반으로 요소를 선택할 수 있습니다.

2. 의사 클래스 선택기: 의사 클래스 선택기는 마우스 오버, 클릭, 포커스 등 특정 상태의 요소를 선택하는 데 사용됩니다. 예를 들어, :hover 선택기는 마우스가 가리키고 있는 요소를 선택합니다.

3. 하위 요소 및 하위 선택자: 이 선택자는 하위 요소 또는 요소의 하위 요소를 선택할 수 있습니다. 예를 들어 div > p는