CSS - 속성 선택자
- 각종정보모음/컴퓨터
- 2020. 3. 16.
속성 선택자는 특정 속성과 값이 있는 태그를 선택할때 사용함 속성과 같은 대괄호( [ ] )를 사용해 입력함
input 태그는 이름이 모두 같지만 type 속성에 따라 형태가 다름 그래서 input 태그를 선택할 때는 속성
선택자를 많이 사용함
| 속성 선택자 | 선택자[속성=값] | input[type=text] |
| 선택자[속성~=값] | div[data-role~=row] | |
| 선택자[속성|=값] | div[data-role|=row] | |
| 선택자[속성^=값] | div[data-role^=row] | |
| 선택자[속성$=값] | div[data-role$=row] | |
| 선택자[속성*=값] | div[data-role*=row] |
<!DOCTYPE html>
<html>
<head>
<title>CSS 속성 선택자</title>
<style>
input[type="text"] {background:red;}
input[type="password"] {background:blue;}
</style>
</head>
<body>
<form>
<input type="text">
<input type="password">
</form>
</body>
</html>
'각종정보모음 > 컴퓨터' 카테고리의 다른 글
| CSS - 반응선택자 (7) | 2020.03.20 |
|---|---|
| CS Position 속성 활용팁 (margin과 absoulte 활용) (14) | 2020.03.18 |
| 후손선택자와 자손선택자 (7) | 2020.03.18 |
| CSS 기본선택자(전체선택자/태그선택자/아이디선택자/클래스선택자) (30) | 2020.03.15 |
| HTML5 시맨틱 태그 (4) | 2020.03.15 |
| HTML5 공간분할태그 (8) | 2020.03.15 |