JunO3O
속성 선택자
속성 선택자
2023. 3. 21. 03:03ㆍCSS
속성 선택자
ㅁ 속성 선택자는 아래 표와 같은 형태로 입력하며, 특정 속성과 값이 있는 태그를 선택할 때 사용합니다.
ㅁ 대괄호 [ ] 를 사용해 입력합니다.
| 형태 | 설명 |
| 선택지[속성] | 특정한 속성이 있는 태그 선택 |
| 선택지[속성 = 값] | 특정한 속성 내부 값이 특정 값과 같은 태그 선택 |
# 속성 선택자
ㅁ 속성 선택자를 사용해 input 태그를 선택할 수 있습니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> 속성 선택자 </title>
<style>
input[type="text"] {
background-color: yellow;
}
input[type="password"] {
background-color: greenyellow;
}
</style>
</head>
<body>
<form>
<input type="text">
<input type="password">
</form>
</body>
</html>
ㄴ> input을 통해 [type="속성"] 을 선택하여 속성 선택자를 이용할 수 있습니다.
'CSS' 카테고리의 다른 글
| 반응 / 상태 / 구조 선택자 (0) | 2023.03.21 |
|---|---|
| 후손 선택자 / 자손 선택자 (0) | 2023.03.21 |
| 기본 선택자 (0) | 2023.03.21 |
| 선택자 (0) | 2023.03.21 |
| 플렉서블 박스 레이아웃 (0) | 2023.03.21 |