<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
p:only-child { /* 자식이 하나이고, p 태그 일 때 적용 */
color: red;
}
p:only-of-type { /* 자식이 몇개든 상관은 없고, 그 중 p태그가 하나 일 때 */
background-color: yellow;
}
</style>
</head>
<body>
<p>good!!!</p>
<h3>안녕~~~</h3>
<div>
<p>Hello world</p>
</div>
</body>
</html>
'웹 프로그래밍 > CSS' 카테고리의 다른 글
[CSS] 접두어 webkit, moz, o, ms 의미 (0) | 2020.06.15 |
---|---|
[CSS] 선택자에서 단일콜론과 이중콜론의 차이점(p::selection 의미) (0) | 2020.06.15 |
[CSS] first-child VS first-of-type 차이점 (0) | 2020.06.15 |
[CSS] a 태그 다양한 설정(link, visited, hover 등) (0) | 2020.06.15 |
[CSS] 형제 연산자( ~, +) 적용해보기 (0) | 2020.06.15 |