CSS3에서 태그 또는 요소 선택기 사용 방법 - 더미

태그 (또는 요소) 셀렉터

는

와 같은 태그를 선택하는 데 사용하는 CSS3의 문자 시퀀스입니다. 및

. 사실,이 방법으로 모든 HTML 태그를 선택할 수 있습니다. 태그 선택기는 항상 p 또는 h1과 같은 태그 이름을 사용합니다. 그러나 몇 가지 흥미로운 태그 선택기 조합에 대해 알아야합니다.

다음 목록은 간단한 태그 선택기와 함께 사용할 수있는 태그 선택기에 대해 설명합니다.

• -> 태그 , 태그 : 두 태그를 쉼표로 구분하면 문서에 나타나는 위치와 상관없이 두 태그를 모두 선택하는 것입니다. 예를 들어, p, div

  를 사용하면 문서 내의 모든 및

• 태그를 선택할 수 있습니다. 태그 태그 : 두 개의 태그를 큼 기호 (>> )로 구분하면 다른 태그가있는 태그를 선택하라는 메시지가 브라우저에 표시됩니다 부모의. 예를 들어

  가 있고 div> p 를 사용하면 브라우저가

  태그를 선택합니다.

• 태그 태그 : 두 태그를 공백으로 구분하면 브라우저가 다른 태그에 나타나는 태그를 선택합니다. 이 선택자는 첫 번째 태그가 두 번째 태그 바로 앞에 직접 나타나지 않아도된다는 것을 나타내는 큰 기호를 사용하는 것과 다릅니다.

  예를 들어,

  가 있고 div> p 를 사용하면 브라우저에서 아무 것도 선택하지 않습니다. 그러나 div p 를 대신 사용하면 브라우저가

  태그를 선택합니다.

• 태그 + 태그 : 두 태그를 더하기 기호 (+)로 구분하면 브라우저가 다른 태그 바로 뒤에 나타나는 태그를 선택합니다. 예를 들어

  가 있고 div + p 를 사용하면 브라우저는

  태그를 선택합니다.

  태그는 태그 내에 나타나지 않으며 태그 다음에 나타납니다.

• Tag ~ Tag : 두 개의 태그를 물결 기호 ( ~ )로 구분하면 다른 태그 뒤에 나타나는 모든 태그를 브라우저가 선택하도록 지시합니다. 예를 들어,

  가 있고 div ~ p 를 사용하면 브라우저는

  태그를 모두 선택합니다. 이것은 div + p 와 다른데, 이는 브라우저가

  태그 다음에 오는 첫 번째 태그 만 선택하도록합니다.

• : root: 문서의 루트 요소를 선택합니다. 루트 요소는 문서 유형에 따라 다릅니다. 이 선택기는 일반적으로 XML 문서와 함께 사용되지만 잠재적으로 모든 문서 유형과 함께 사용할 수 있습니다.