가상요소 선택자 (Pseudo-element selector)

selector:____

selector:: ____

둘 다 사용가능 하지만 :: 사용을 권장한다.

---

::before, after

실제 컨텐츠는 아니지만 꾸며줄 때 사용된다.

.favorite::before {
content: '⭐️';}

=> favorite이라는 class를 가진 요소 앞에 ⭐️이 붙고, 이 ⭐️은 일반 컨텐츠가 아니라서 드래그 선택이 안된다.

---

::first-letter

첫 번째 글자에만 스타일 적용

.lorem::first-letter {
color: red;
font-size: 30px;
}

::first-line

첫 번째 문장에만 스타일 적용

.lorem::first-line {
color: red;
}

::selection

드래그한 부분에만 스타일 적용

.lorem::selection {
background-color: blue;
}