[CSS] outline이란?

outline이란 요소를 시각적으로 확인하기 위하여 테두리(border) 바깥쪽에 생기는 선을 말한다.

일반 요소들에는 주지 않고 input, a, textarea, button, select처럼 focus를 받을 수 있는 요소들에 준다.

✅ 관련 속성

속성명	설명	가능한 값 예시
outline	outline-width, outline-style, outline-color를 한꺼번에 설정하는 단축 속성	2px solid blue, none
outline-width	외곽선 굵기 설정	thin, medium, thick, 3px, 0
outline-style	외곽선 스타일 설정	none, solid, dotted, dashed, double 등
outline-color	외곽선 색상 설정	blue, #ff0000, transparent, currentColor
outline-offset	요소 경계(border)와 외곽선 사이 간격 조절	0, 2px, -1px (음수 가능)