국경 스타일 (CSS 재산)

구문 국경 스타일

: 없음 숨겨진 점선 점선 solid double 그루브 Ridge 삽입 처음 } 1 ~ 4 값 | 상속 } ; 설명 속성 경계 스타일은 지정된 값을 사용하여 요소의 4면 모두에 테두리 스타일을 설정합니다. 각 국경은 속기 순서를 쉽게 기억할 수있는 속성 속성의 니모닉 (문제)을 참조하여 자체 가치를 가질 수 있습니다. 테두리는 요소의 배경 위에 놓여 있습니다. 예제 이 스타일 규칙은 견고한 테두리를 할당합니다. 상단에, 바닥으로 돌진하는 경계선, 점선 테두리가 ID가있는 요소 내의 단락의 왼쪽 및 오른쪽 "예": value 아무것도 테두리가 표시되지 않으며 계산 된 테두리 width는 0입니다. hidden은 두 개의 세포가 경계를 공유하는 경우 테이블 경계를 지칭하고 테이블 셀에 테두리가 무너진 경우 (Border-Collapse : Collapse;)를 제외하고는 아무것도 의미하지 않습니다. 숨겨진 가치는 숨겨진 것이 다른 모든 테두리 스타일보다 우선하기 때문에 국경이 그려지지 않도록합니다. 셀의 한 경계에 사용 된 것이 없다면 인접한 셀 테두리가 우선하기 때문에 국경은 여전히 ​​그려 질 것입니다. 자세한 내용은 테이블 서식을 참조하십시오 점선은 경계를 일련의 점으로 구현합니다 점선은 경계를 일련의 대시로 구현합니다 솔리드는 경계를 실선으로 구현합니다 이중은 테두리를 두 개의 실선으로 구현합니다. 두 테두리 너비의 합과 그들 사이의 공간은 경계 벌레에 대해 설정된 값과 같습니다.

그루브는 국경이 캔버스에 새겨 져 있다는 인상을주는 3 차원 효과입니다.

릿지는 홈이 캔버스에서 튀어 나오는 것처럼 보이기 때문에 그루브의 반대 효과를 갖는 3D 효과입니다.

#example p {
  border-style: solid dotted dashed;
}

.

삽입은 상자가 캔버스에 포함된다는 인상을주는 3D 효과입니다. 분리 된 테두리 모델이 적용된 테이블에 사용되면 삽입 된 값은 전체 상자를 캔버스에 포함시킨 것처럼 보이게하는 것으로 보입니다. 붕괴 된 테두리 모델과 함께 사용하면 값 융기 부분과 동일하게 취급됩니다. 처음 시작은 테두리가 상자가 캔버스에서 튀어 나온다는 인상을 준다는 점에서 삽입의 반대 효과를 갖는 3D 효과입니다. 분리 된 테두리 모델이 적용된 테이블에 사용되면 테두리는 전체 상자를 캔버스에서 나오는 것처럼 보이게 만듭니다. 붕괴하는 테두리 모델과 함께 사용되면 그루브와 같은 방식으로 작동합니다.
• 이전에 CSS1에서 사용자 에이전트는 모든 점선, 점선, 더블, 그루브, 릿지, 삽입 및 시작 스타일을 견고한 것으로 해석 할 수있었습니다. CSS 국경 스타일에 대한 자주 묻는 질문 (FAQ) CSS의 다양한 유형의 테두리 스타일은 무엇입니까?

  CSS에는 웹 요소의 모양을 사용자 정의하는 데 사용할 수있는 여러 유형의 테두리 스타일이 있습니다. 여기에는‘없음’,‘숨겨진’,‘점선’,‘점선’,‘단단한’,‘이중’,‘그루브’,‘릿지’,‘삽입’및‘처음’이 포함됩니다. 각 스타일에는 독특한 시각적 효과가 있습니다. 예를 들어, '점선'은 일련의 도트로 테두리를 생성하고 '더블'은 더블 라인 테두리를 생성합니다.
  CSS에서 테두리의 너비와 색상을 어떻게 설정할 수 있습니까?
CSS에서는 각각 '국경 폭'및 '국경 색상'속성을 사용하여 테두리의 너비와 색상을 설정할 수 있습니다. 예를 들어, 5 픽셀의 테두리 너비와 빨간색의 색상을 설정하려면 다음 코드를 사용합니다. 테두리 width : 5px;

Border-Color : Red;

CSS의 'None'과 'Hidden'테두리 스타일의 차이점은 무엇입니까?

CSS의 'None'과 'Hidden'테두리 스타일은 비슷해 보일지 모르지만 그들은 가지고 있습니다. 미묘한 차이. ‘없음’은 국경이 그려지지 않았 음을 의미하는 반면,‘숨겨진’는 국경이 그려졌지만 보이지 않음을 의미합니다. 이 차이는 '숨겨진'이 세포 사이의 경계를 숨기는 데 사용될 수있는 테이블 요소에서 가장 눈에 띄게 나타납니다.

CSS의 요소의 다른 측면에 대해 다른 테두리 스타일을 어떻게 지정할 수 있습니까? CSS, '국경-표식', '국경 오른쪽 스타일', '국경 바닥 스타일'및 ‘왼쪽 스타일’속성. 예를 들어, 상단에 단단한 테두리를 설정하려면 아래쪽 코드를 사용하면 다음 코드를 사용합니다. 테두리 스타일 : Solid;

Border-Bottom 스타일 : 점선. ;

CSS의 속기 '국경'속성을 어떻게 사용할 수 있습니까?

CSS의 속기 '국경'속성을 통해 경계의 너비, 스타일 및 색상을 설정할 수 있습니다. 한 줄의 코드. 구문은‘테두리 : 너비 스타일 색상;’입니다. 예를 들어, 5 픽셀 솔리드 레드 테두리를 설정하려면 다음 코드를 사용합니다.

테두리 : 5px Solid Red;
. CSS의 기본 테두리 스타일은 얼마입니까?

CSS의 기본 테두리 스타일은‘없음’이므로 테두리가 그려지지 않음을 의미합니다. 요소에 테두리를 추가하려면 'None'이외의 경계 스타일을 지정해야합니다.

CSS의 경계 색상에 16 진수 색상 코드를 사용할 수 있습니까? 16 진 컬러 코드를 사용하여 CSS의 테두리 색상을 지정할 수 있습니다. 예를 들어, 테두리 색상을 밝은 파란색으로 설정하려면 다음 코드를 사용합니다.

Border-Color : #add8e6;

CSS에서 둥근 테두리를 어떻게 만들 수 있습니까?

'Border-Radius'속성을 사용하여 CSS에서 둥근 테두리를 만들 수 있습니다. 이 속성을 사용하면 테두리 모서리의 반경을 설정하여 둥근 효과를 만듭니다. 예를 들어, 테두리 반경 10 픽셀을 설정하려면 다음 코드를 사용합니다.

Border-Radius : 10px;
이미지와 함께 CSS에서 '테두리'속성을 사용할 수 있습니까? 예, CSS의 '국경'속성을 사용하여 이미지에 테두리를 추가 할 수 있습니다. 이것은 페이지의 이미지를 강조 표시하거나 페이지의 다른 요소와 분리하는 데 유용 할 수 있습니다.

그라디언트 색상으로 테두리를 만드는 방법 CSS는 조금 더 복잡하며 선형 구배가있는 배경 이미지를 사용하고 패딩 및 배경 클립 특성을 조정해야합니다. 다음은 수행 할 수있는 방법에 대한 예입니다.

.box {

배경 : Linear-Gradient (하단, 빨간색, 빨간색);

Border-width : 10px;
테두리 -Style : solid; 테두리 이미지 : 선형 그라디언트 (하단, 빨간색, 파란색) 1;

위 내용은 국경 스타일 (CSS 재산)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!