English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

CSS 참조 가이드

CSS @규칙(RULES)

CSS 속성 전체

CSS border-right-size 속성

border-right-style 속성 사용 방법 및 예제border-style또는border-right이와 같은 축약된 CSS 속성은 사용하기 더 편리하며, 더 좋습니다.

아래 표는 이 속성의 사용 설명과 버전 기록, 그리고 이 속성이 JavaScript 스크립트에서 사용하는 문법을 나타냅니다.

기본 값:none
적용:모든 요소
thừa kế:없음
애니메이션 가능:아니요.참조: 애니메이션 속성
버전:CSS 1,2,3
JavaScript 문법:object object.style.borderRightStyle="dashed"

border-right-style 사용 문법

이 속성의 문법은 다음과 같습니다:

border-right-style: none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset | initial | inherit

아래의 예제는 border를 사용하는 방법을 보여줍니다.-right-style 속성.

  p {
   border-right-style: dashed;
   border-right-width: 3px;
  }
테스트 보기‹/›

속성 값

아래 표는 이 속성의 값을 설명합니다.

설명
none경계선이 표시되지 않습니다.
hidden같은 none와 다른 점은 테이블 셀에굴절된 경계선두 셀이 공유하는 경계선입니다. hidden 값은 경계선 스타일보다 우선하여 경계선을 그리지 않습니다.
dotted경계선을 여러 개의 점으로 표시합니다.
dashed경계선을 여러 개의 짧은 선간격으로 표시합니다.
solid경계선을 단일 실선으로 표시합니다.
double경계선을 두 개의 평행한 실선으로 표시하고, 그들 사이에 간격을 두며, 두 줄의 총 길이와 그들 사이의 간격은border-width의 값을 나타냅니다.
groove효과를 표시하여 그림면에 새겨진 경계선처럼 보입니다. 이는3D의 인상, 일반적으로 경계선 색상보다border-color더 밝고 더 어두운 두 가지 색상으로 그림자를 만들어 이루어집니다.
ridge효과와 반대의 경계선 groove를 표시합니다. 또한, 이는3D의 인상, 경계선이 그림면에서 나오는 것처럼 보입니다.
inset효과를 표시하여 요소의 테두리가 그림면에 들어간 것처럼 보입니다. 이는3D, 이는 일반적으로 그림자의 두 가지 색상을 만들어 경계선 색상보다border-color약간 밝고 깊은 두 가지 색상으로 그림자를 만들어 이루어집니다.
outset효과와 반대의 경계선 inset을 표시합니다. 또한, 이는3D의 인상, 경계선이 그림면에서 나오는 것처럼 보입니다.
initial이 속성을 기본 값으로 설정합니다.
inherit지정된 경우, 부모 요소의 border를 사용하는 요소와 연결됩니다.-right-아래 표는 이 속성의 값을 설명합니다.

속성 값

border-right-style의 속성 값.

  • 브라우저 호환성 1+

  • style 속성의 브라우저 호환성, 아래 표의 숫자는 이 속성을 지원하는 브라우저의 최소 버전 번호를 나타냅니다; 모든 주요 브라우저는 이 속성을 지원합니다.1+

  • Opera 4+

  • Firefox 1+

  • Google Chrome 4+

Apple Safari Opera 7경고:8Internet Explorer지원하지만, value hidden이 필요합니다. IE9및 이후 버전에서 hidden 값을 지원합니다。. IE

더 읽기

教程 참조:CSS BorderCSS3 Border

관련 속성:borderborder-styleborder-rightborder-right-color
border-right-width