CSS에서 ="XYZ"의 라벨을 선택하는 방법은?

CSS에서 ="XYZ"의 라벨을 선택하는 방법은?

label {
  display: block;
  width: 156px;
  cursor: pointer;
  padding-right: 6px;
  padding-bottom: 1px;
}

<label for="email">{t _your_email}:</label>

저는 라벨을 선택하고 싶습니다.'for'특성을 지정하여 레이아웃을 변경합니다.

선택자는 다음과 같습니다.label[for=email], 따라서 CSS에서:

label[for=email]
{
    /* ...definitions here... */
}

...또는 DOM을 사용하는 자바스크립트로:

var element = document.querySelector("label[for=email]");

...또는 jQuery를 사용하는 자바스크립트로:

var element = $("label[for=email]");

속성 선택기입니다.일부 브라우저(예를 들어 IE < 8 버전)는 속성 선택기를 지원하지 않을 수 있지만 최근 버전은 지원합니다.IE6 및 IE7과 같은 오래된 브라우저를 지원하려면 클래스(음, 또는 다른 구조적 방식)를 사용해야 합니다.

(템플릿이 우리가 원하는 장소에{t _your_email}필드에 을 채웁니다.id="email". 그렇지 않은 경우 클래스를 사용합니다.)

선택하는 속성의 값이 CSS 식별자에 대한 규칙에 맞지 않는 경우(예를 들어 공백이나 괄호가 있거나 숫자로 시작하는 경우 등) 값에 대한 따옴표가 필요합니다.

label[for="field[]"]
{
    /* ...definitions here... */
}

따옴표는 한 개 또는 두 개일 수 있습니다.

만약에label 지정된 사항을 즉시 따릅니다.input요소:

input#example + label { ... }
input:checked + label { ... }

내용이 변수인 경우 따옴표로 연결해야 합니다.그것은 나에게 효과가 있었다.다음과 같은 경우:

항목선택(id: number){console.log(로그) label contains', document.querySelector("label[for=' + id + ""]"));}

언급URL : https://stackoverflow.com/questions/2599627/how-to-select-label-for-xyz-in-css