CSS 테두리 색상 설정 - CSS border-color

 

 

CSS 테두리 색상 설정 border-color

CSS에서는 웹페이지의 요소에 테두리를 설정하고

그 색상을 변경하기 위해 'border-color' 속성을 사용합니다.

이 속성은 테두리의 색상을 설정하거나 변경할 수 있습니다.

 

 

 

 

728x90

 

CSS border-color 기본 사용법

CSS border-color의 기본 사용법은 다음과 같다.

 

selector {
  border-color: color;
}

 

이때 'selector'는 색상을 변경하고자 하는 요소를 선택하는 부분이며, 'color'는 원하는 색상을 지정하는 부분이다. 'color'는 이름(예: red, blue), RGB, RGBA, HEX 등 다양한 형식으로 지정할 수 있다.

 

 

 

CSS border-color 색상 적용 예제

다양한 색상을 적용하는 예제를 알아보자.

 

1. 이름으로 색상 적용하기

div {
  border: 2px solid;
  border-color: red;
}

 

 

2. RGB로 색상 적용하기

div {
  border: 2px solid;
  border-color: rgb(255, 0, 0);
}

 

 

3. RGBA로 색상 적용하기

div {
  border: 2px solid;
  border-color: rgba(255, 0, 0, 0.3);
}

 

 

4. HEX로 색상 적용하기

div {
  border: 2px solid;
  border-color: #ff0000;
}

 

이렇게 다양한 방법으로 CSS border-color를 통해 웹페이지의 테두리 색상을 변경할 수 있다.

웹페이지의 디자인에 맞게 적절한 색상을 선택하여 사용해 보자.

 

 

 

 

마무리

 

오늘은 CSS의 border-color에 대해 알아보았다.

이를 통해 웹페이지의 요소의 테두리 색상을 자유롭게 변경할 수 있다.