HTML DOM 스타일 outlineColor 속성
스타일 개체 정의 및 사용
outlineColor는 속성 집합 또는 요소 주위의 윤곽의 색을 돌려줍니다.
문법
outlineColor 속성 설정 :
Object.style.outlineColor="color|invert|inherit"
위로 outlineColor 속성 :
Object.style.outlineColor
| 值 | 描述 |
|---|---|
| color | 规定轮廓的颜色。在 CSS 颜色值 中寻找可能的颜色值的完整列表。 |
| invert | 默认。反转轮廓的颜色为相反值。 |
| inherit | 轮廓的颜色从父元素继承。 |
브라우저 지원
모든 주요 브라우저는 outlineColor 속성을 지원합니다.
참고 : IE7 및 이전 버전 outlineColor 속성을 지원하지 않습니다.IE8은!의 DOCTYPE 지원 outlineColor 속성을 제공합니다. IE9 지원 outlineColor 속성입니다.
팁과주의 사항
주변 요소 주변의 등고선. 그것은 주변 요소의 여백에 표시됩니다. 그러나, 테두리 속성 다르다.
프로파일의 일부 요소의 크기없고, 따라서, 폭과 높이의 프로파일의 폭을 포함하지 않는 요소의 속성.
예
예
윤곽의 색상을 변경합니다 :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>本教程(w3big.com)</title>
<style type="text/css">
#ex1{
border:1px solid red;
outline:green dotted thick;
}
</style>
<script>
function displayResult(){
document.getElementById("ex1").style.outlineColor="#0000FF";
}
</script>
</head>
<body>
<div id="ex1">这是一些文本。</div>
<br>
<button type="button" onclick="displayResult()">修改外边框颜色</button>
<p><b>注意:</b> IE8 及以下版本如果要支持 outline 属性，则必须声明 !DOCTYPE。</p>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>本教程(w3big.com)</title>
<style type="text/css">
#ex1{
border:1px solid red;
outline:green dotted thick;
}
</style>
<script>
function displayResult(){
document.getElementById("ex1").style.outlineColor="#0000FF";
}
</script>
</head>
<body>
<div id="ex1">这是一些文本。</div>
<br>
<button type="button" onclick="displayResult()">修改外边框颜色</button>
<p><b>注意:</b> IE8 及以下版本如果要支持 outline 属性，则必须声明 !DOCTYPE。</p>
</body>
</html>
»시도
스타일 개체