>웹 프론트엔드 >CSS 튜토리얼 >CSS 테두리 색상 속성 사용법_CSS 튜토리얼_CSS_웹페이지 제작

CSS 테두리 색상 속성 사용법_CSS 튜토리얼_CSS_웹페이지 제작

巴扎黑
巴扎黑원래의
2017-06-28 13:58:581893검색

border-color - 네 개의 테두리 색상을 정의합니다. 값:[ 투명 ]{1,4} | {1,4}: 색상 표현 투명{1,4}: 투명 상속: inherit 초기값: colorproperty 기본값과 동일 상속: 아니요 적용 대상: 모든 요소 테두리: 테두리, 색상: 색상. 국경-콜로 border-color - 네 개의 테두리 색상을 정의합니다.
값: [ 투명 ]{1,4} | 상속
{1,4}: 색상 표현
transparent{1,4 } : Transparent
inherit: Inherit
초기값: 색상 속성의 기본값과 동일
상속: No
적용 대상: 모든 요소
border: border, color: color
border-color 및 border- 할당 방법입니다. width가 동일하면 각각 1, 2, 3 또는 4개의 색상 값을 할당할 수 있습니다.

Example
p#fourborders
{
border-color:red black blue green; 정의한 다음 이 네 가지 값은 각각 위쪽, 오른쪽, 아래쪽 및 왼쪽 테두리입니다(상단 테두리에서 시작하여 시계 방향으로 순회). Dream City 단락의 위쪽 테두리를 빨간색, 오른쪽 테두리로 정의합니다. 검은색, 아래쪽 테두리는 파란색, 왼쪽 테두리는 녹색입니다.

p#3borders
{
border-color:red black blue
3개의 값만 정의하면 가운데가 됩니다. 값은 왼쪽 및 오른쪽 테두리를 나타냅니다. Dream City 단락의 위쪽 테두리는 빨간색으로, 아래쪽 테두리는 파란색으로, 왼쪽 및 오른쪽 테두리는 검정색으로 정의합니다.
border-color:red black;
}
두 개의 값만 정의하는 경우 전자의 값은 위쪽 및 아래쪽 테두리를 나타내고 후자의 값은 왼쪽 및 오른쪽 테두리를 나타냅니다. Dream City 단락은 빨간색으로, 오른쪽과 왼쪽 테두리는 검정색으로

p#oneborders
{
border-color:red
}
한 값만 정의하면 이 값은 4개의 테두리를 나타냅니다.

스크립트 홈 팁: 테두리 색상 border-color가 설정되지 않은 경우 테두리 색상은 이 요소의 색상 속성 값을 사용합니다.

p#bordercolor
{
border-
bottom
:solid;
color:red;
}
위 예시에서는 border-color 값이 설정되지 않았기 때문에 color 값이 빨간색으로 사용됩니다.
css border-color 속성 예시 - color 사용 색상 값.
스크립트 홈 팁: CSS 속성에는 우선적인 특성이 있으므로 설정 순서가 중요합니다.

p
{
border:medium solid green;
color:red; 위 예시에서는 하단 테두리의 색상이 빨간색이고,
다른 테두리는 녹색입니다. 테두리 하단은 색상을 지정하지 않기 때문에 색상별로 지정된 색상을 사용해야 합니다.

위 내용은 CSS 테두리 색상 속성 사용법_CSS 튜토리얼_CSS_웹페이지 제작의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.