CSS의 border-right-color 속성은 요소의 오른쪽 테두리 색상을 개별적으로 지정할 때 사용합니다. 전체 테두리가 아닌 오른쪽 테두리만 다른 색으로 강조하고 싶을 때 유용합니다.
주요 특징
이 속성은 border-style과 border-width가 먼저 설정되어 있어야 화면에 표시됩니다. 색상 값은 HEX 코드(#FF0000), RGB, RGBA, 색상 이름(red) 등 CSS에서 지원하는 모든 형식을 사용할 수 있습니다.
예제 코드
아래 예제는 border-right-color 속성을 활용해 문단의 오른쪽 테두리만 빨간색으로 변경하는 방법을 보여줍니다.
<html>
<head>
<style>
p.demo {
border:3px solid;
border-right-color:#FF0000;
}
</style>
</head>
<body>
<p class = "demo">
border-right-color 속성 적용 예시입니다.
</p>
</body>
</html>실행 결과
위 코드를 실행하면 검은색 실선 테두리 중 오른쪽 테두리만 빨간색(#FF0000)으로 표시됩니다. 이처럼 border-right-color를 활용하면 테두리의 특정 방향만 원하는 색상으로 자유롭게 꾸밀 수 있습니다.