[CSS] before, after

CSS 에서 ::before, ::after 는 엘리먼트의 첫번째, 마지막 자식 엘리먼트를 정의합니다.

HTML 코드:

내가 그린 <span>그림</span> 네가 그린 <span>그림</span>

CSS 코드:

span:before {
	content: '【';
}

span:after {
	content: '】';
}

결과:

내가 그린 그림 네가 그린 그림

【그림】 과 같이 '그림' 앞뒤로 before → 【 , after → 】 가 추가된것을 확인할 수 있습니다.

댓글