CSS에서 요소의 윤곽선(outline)을 파선 형태로 표시하려면 outline-style 속성에 dashed 값을 지정하면 됩니다.
윤곽선은 요소의 테두리(border) 바깥쪽에 그려지는 선으로, 주로 시각적인 강조나 포커스 표시 등에 활용됩니다. 파선 스타일을 적용하면 실선보다 부드러운 인상을 주면서도 영역을 명확하게 구분할 수 있습니다.
기본 문법
outline-style: dashed;
예제
아래 예제는 6px 두께의 파선 윤곽선을 텍스트에 적용한 코드입니다.
<html>
<head>
</head>
<body>
<p style = "outline-width:6px;outline-style:dashed;">
이 텍스트에는 6px 파선 윤곽선이 적용되어 있습니다.
</p>
</body>
</html>
코드 설명
- outline-width: 6px; — 윤곽선의 두께를 6픽셀로 지정합니다.
- outline-style: dashed; — 윤곽선을 파선 형태로 표시합니다.
참고로 dashed 외에도 dotted(점선), solid(실선), double(이중선) 등 다양한 윤곽선 스타일 값을 사용할 수 있으며, 상황에 맞게 조합하여 활용하면 됩니다.