Style borderTopStyle 속성

정의와 사용법

borderTopStyle 요소에 경계선 스타일 설정 또는 반환.

추가로 참조:

CSS 강의:CSS 경계선

CSS 참조 매뉴얼:border-top-style 속성

HTML DOM 참조 매뉴얼:border 속성

예제

예제 1

HTML <div> 요소에 실체적인 상단 경계선 추가:

document.getElementById("myDiv").style.borderTopStyle = "solid";

직접 시험해 보세요

예제 2

<div> 요소의 상단 경계 스타일을 "dotted"으로 변경합니다:

document.getElementById("myDiv").style.borderTopStyle = "dotted";

직접 시험해 보세요

예제 3

반환 <div> 요소의 상단 경계 스타일:

alert(document.getElementById("myDiv").style.borderTopStyle);

직접 시험해 보세요

예제 4

모든 다른 값에 대한 설명:

var listValue = selectTag.options[selectTag.selectedIndex].text;
document.getElementById("myDiv").style.borderTopStyle = listValue;

직접 시험해 보세요

문법

borderTopStyle 속성 반환：

object.style.borderTopStyle

borderTopStyle 속성 설정：

object.style.borderTopStyle = value|initial|inherit
값 설명
none 경계선이 없음을 정의합니다. 기본값.
hidden "none"와 같지만, 테이블 요소의 경계선 충돌을 해결할 때는 제외됩니다.
dotted 점말 경계선을 정의합니다.
dashed 점선 경계선을 정의합니다.
solid 실선 경계선을 정의합니다.
double 두 경계선을 정의합니다. 두 경계선의 너비는 border-width의 값과 동일합니다.
groove 3D groove 경계선을 정의합니다. 효과는 border-color 의 값
ridge 3D ridge 경계선을 정의합니다. 효과는 border-color 의 값
inset 3D inset 경계선을 정의합니다. 효과는 border-color 의 값
outset 3D outset 경계선을 정의합니다. 효과는 border-color 의 값
initial 이 속성을 기본 값으로 설정합니다. 참조하십시오 initial。
inherit 부모 요소에서 이 속성을 상속받습니다. 참조하십시오 inherit。

기술 세부 사항

기본 값： none
반환 값： 문자열로, 요소 상단 경계 스타일을 나타냅니다.
CSS 버전： CSS1

브라우저 지원

크롬 에지 파이어폭스 사파리 오페라
크롬 에지 파이어폭스 사파리 오페라
지원 지원 지원 지원 지원