반응형
태그 선택자 xxx
: 모든 xxx라는 태그에 적용된다.
클래스 선택자 .xxx
: '클래스가 xxx'인 모든 것에 대하여 적용되며, 클래스 선택자간 중복될 경우 먼저 기록된 선택자가 우선된다.
아이디 선택자 #xxx
: 고유한 xxx로 한번만 적용가능하며, 중복되어서는 안된다. 아이디 선택자가 클래스 선택자보다 우선한다.
[포괄성]
태그 선택자 > 클래스 선택자 > 아이디 선택자
[적용 우선순위]
아이디 선택자 > 클래스 선택자 > 태그 선택자
#xxx yyy식으로 합쳐서 적용할 수 있다.
<html>
<head>
<meta charset="utf-8">
<style>
a{
color:black;
text-decoration:none;
}
#active{
color:red;
}
.saw{
color:gray;
}
</style>
</head>
<body>
<li><a href="index.html>WEB</a></h1>
<ol>
<li><a href="1.html" class="saw">HTML</a></li>
<li><a href="2.html" class="saw active">CSS</a></li>
<li><a href="1.html" class="saw" id="active">JavaScript</a></li>
</ol>
</body>
</html>
선택자 모음 링크
반응형
'Programming Language > Html-CSS' 카테고리의 다른 글
| [CSS] 미디어쿼리 (media query) (0) | 2020.05.01 |
|---|---|
| [CSS] 그리드 (Grid) (0) | 2020.05.01 |
| [CSS] 박스모델 (Box model) (0) | 2020.05.01 |
| [CSS] 속성 (Properties) (0) | 2020.05.01 |
| CSS 기본구조 (CSS basic structure) (0) | 2020.05.01 |