웹 캡처 및 변환 도구

GrabzIt에서 CSS 선택기 사용하기

CSS 선택기는 대상 요소에서 사용되며 요소를 숨기고 요소 기능이 하나 이상의 HTML 요소를 식별 할 때까지 기다립니다. CSS 선택기의 두 가지 주요 유형은 id 또는 class로 선택하는 것입니다. 아래와 같이 id 속성이 포함 된 HTML 요소에는 id가 있습니다.

<span id="myidentifier">Example Text</span>

그것을 선택하려면 다음과 같은 CSS 선택기를 만듭니다. #myidentifier

HTML 요소에 클래스가 있으면이 예제와 같이 클래스 속성이 있습니다.

<div>
<span class="myclass">Example Text One</span>
<span class="myclass">Example Text Two</span>
<span class="myclass">Example Text Three</span>
</div>

그것을 선택하려면 다음과 같은 CSS 선택기를 만듭니다. .myclass

클래스를 사용하여 특정 요소를 선택하려면 myclass 이 경우 표준 CSS 선택기를 사용하여 n- 자식 (2) 이렇게 선택기 : .myclass:nth-child(2) 두 번째 myclass 범위를 선택합니다. 그러나 부모 div 요소 아래에 다른 요소가 없기 때문에이 경우에만 작동합니다. 예를 들어 p 요소가 있다면 n 번째 자식 인덱스를 변경합니다.

여러 개의 일치하는 요소 처리

CSS 선택기에서 여러 HTML 요소가 반환되고 대상 요소를 사용하거나 요소 기능을 기다리는 경우 첫 번째 일치하는 요소 만 사용됩니다. 그러나 요소 숨기기 기능을 사용하는 경우 일치하는 모든 HTML 요소가 숨겨집니다.

다른 ID 또는 클래스로 여러 요소를 숨기려면 각 CSS 선택기를 쉼표로 구분하여 그렇게 할 수 있습니다. 예를 들어 위의 예제 클래스와 id를 숨기려면 다음을 사용하십시오. #myidentifier,.myclass