가상 요소1 [CSS] 가볍게 알아보는 가상 요소(pseudo element), ::after, ::before 등 가끔가다 CSS 문법 중에서 선택자(HTML 태그) 뒤에 콜론이 오고 after, before와 같은 단어들이 있는 경우를 본 적이 있다. 예를 들면, p::after, p::before와 같은 경우다. 궁금하던 차에 MDN에서 검색하고, 유튜브에서 설명한 내용이 있어 정리해 본다. 이는 의사 요소 또는 가상 요소라고 하는데 영어로는 pseudo element이다. 선택자에 추가하는 키워드로서, 선택한 요소 일부분에 스타일을 입힐 수 있는 역할을 한다고 한다. 위에서 p::after 경우에는 모든 p 선택자 다음에 정의한 스타일대로 요소가 추가된다는 의미를 갖는다. 콜론은 1개(:after)를 입력해도 브라우저에서 인식이 된다고 한다. 다음과 같은 구문으로 사용한다. selector::pseudo-ele.. 2022. 4. 26. 이전 1 다음