속성 값 선택자
속성 값 선택자는 특정 속성의 존재 또는 그 값에 따라 요소를 선택하고 필요한 스타일을 적용할 수 있게 해줍니다.
예시
input 태그를 살펴보겠습니다.
속성 type의 값이
text인 요소에
하늘색 배경색을 지정해 보겠습니다:
<p>
<label>텍스트 입력</label>
<input type="text">
</p>
<p>
<label>숫자 입력</label>
<input type="number">
</p>
input[type="text"] {
background-color: #C2DDFD;
}
:
참고 항목
-
속성 이름으로 요소를 찾는 속성 선택자,
-
속성 값의 시작 부분으로 요소를 찾는 속성 선택자,
-
속성 값의 끝 부분으로 요소를 찾는 속성 선택자,
-
속성 값 내의 텍스트로 요소를 찾는 속성 선택자,
-
속성 값 중 하나로 요소를 찾는 속성 선택자,
-
속성 값 내의 하이픈으로 요소를 찾는 속성 선택자,
-
직접적인 포함 관계로 요소를 선택할 수 있는 자식 선택자,
-
부모 요소에 따라 자식 요소를 선택할 수 있는 후손 선택자,
-
인접한 형제 요소를 선택할 수 있는 인접 형제 선택자,
-
특정 요소 이후의 형제 요소를 선택할 수 있는 일반 형제 선택자,
-
모든 요소를 선택할 수 있는 전체 선택자,
