Style outlineStyle 속성

정의와 사용법

outlineStyle 속성은 요소 주위 경계선 스타일을 설정하거나 반환합니다.

경계선은 요소를 둘러싸고 있는 선입니다. 그것은 요소의 마argins 주위에 표시됩니다. 하지만, 그것은 border 속성과 다릅니다.

경계선은 요소 크기의 일부가 아니기 때문에 요소의 너비와 높이 속성에는 경계선 너비가 포함되지 않습니다.

또는 참고:

CSS 강의:CSS輪郭

CSS 참조 메뉴얼:outline-style 속성

HTML DOM 참조 메뉴얼:outline 속성

인스턴스

예제

<div> 요소 주위에 실선 테두리 추가:

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

document.getElementById("myDiv").style.outlineStyle = listValue;

예제 1

<div> 요소의 테두리 스타일 변경:

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

document.getElementById("myDiv").style.outlineStyle = listValue;

예제 2

<div> 요소의 테두리 스타일 반환:

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

document.getElementById("myDiv").style.outlineStyle = listValue;

예제 3

예제 4

모든 다른 값에 대한 보여주기:
var listValue = selectTag.options[selectTag.selectedIndex].text;

document.getElementById("myDiv").style.outlineStyle = listValue;

직접 테스트해 보세요

문법

outlineStyle 속성 설정:outlineStyle 속성 반환:

.style.outlineStyle

outlineStyle 속성 설정:object .style.outlineStyle =

value

속성 값
none 설명
기본. 테두리 없이 정의합니다. hidden
테두리가 닫혔습니다. 점말 테두리를 정의합니다.
dashed 점선 테두리를 정의합니다.
solid 실선 테두리를 정의합니다.
double 양선 테두리를 정의합니다. 양선의 너비는 outline-width 의 값.
groove 3D 깊은 슬롯 테두리를 정의합니다. 3D 깊은 슬롯 테두리를 정의합니다. 이 효과는 outline-color 값.
ridge 3D 부드러운 슬롯 테두리를 정의합니다. 이 효과는 outline-color 값.
inset 3D 깊은 테두리 테두리를 정의합니다. 이 효과는 outline-color 값.
outset 3D 부드러운 테두리 테두리를 정의합니다. 이 효과는 outline-color 값.
initial 이 속성을 기본 값으로 설정합니다. 참고: initial
inherit 부모 요소에서 이 속성을 继承합니다. 참고: inherit

기술 세부 사항

기본 값: none
반환 값: 문자열, 요소 테두리 스타일을 나타냅니다.
CSS 버전: CSS2

브라우저 지원

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