요소의 테두리 색상과 윤곽선 색상을 정의할 수 있습니다. 테두리와 달리 윤곽선은 공간을 차지하지 않습니다. border-color 속성은 요소의 테두리 색상을 설정하는 데 사용되며 outline-color 속성은 요소의 외곽선 색상을 설정하는 데 사용됩니다.
구문
CSS border-color 및 outline-color 속성의 구문은 다음과 같습니다. -
/*for setting border-color*/
Selector {
border-color: /*value*/
}
/*for setting outline-color*/
Selector {
outline-color: /*value*/
} 다음 예는 CSS border-color 및 outline-color 속성을 보여줍니다 -
예시
<!DOCTYPE html>
<html>
<head>
<style>
span {
margin: 15px;
padding: 20px;
border-style: solid;
border-color: limegreen crimson;
position: absolute;
outline-width: 5px;
outline-style: ridge;
outline-color: orange;
top: 15px;
border-radius: 50%;
}
div {
margin: auto;
border-style: solid;
border-color: darkmagenta dodgerblue;
outline-style: dotted;
outline-color: black;
height: 80px;
width: 80px;
}
</style>
</head>
<body>
<div><span></span></div>
</body>
</html> 출력
이것은 다음 출력을 제공합니다 -
예시
<!DOCTYPE html>
<html>
<head>
<style>
p {
border-width: 5px;
border-style: ridge;
border-color: lightblue;
outline-style: solid;
outline-color: darkviolet;
}
</style>
</head>
<body>
<h2>Exams Timings</h2>
<p>Entrance Exam timings 3PM - 5PM. All candidates are requested to report at 2:45PM.</p>
</body>
</html> 출력
이것은 다음 출력을 제공합니다 -
