HTML DOM 스타일 개요 속성
스타일 개체 정의 및 사용
설정하거나 모든 윤곽 속성을 반환하는 약식 속성을 설명합니다.
문법
윤곽의 속성을 설정합니다 :
Object.style.outline="width style color|inherit"
돌아 가기 개요 속성 :
Object.style.outline
팁 : 개요 속성에는 기본값이 없습니다.
| 参数 | 描述 |
|---|---|
| width | 设置轮廓的宽度。 |
| style | 设置轮廓的样式。 |
| color | 设置轮廓的颜色。 |
| inherit | 规定轮廓属性的值，应该从父元素继承。 |
브라우저 지원
모든 주요 브라우저는 윤곽 속성을 지원합니다.
참고 : IE7 및 이전 버전의 윤곽 속성을 지원하지 않습니다.IE8은!의 DOCTYPE 지원 개요 속성을 제공합니다. IE9는 윤곽 속성을 지원합니다.
팁과주의 사항
주변 요소 주변의 등고선. 이 표시 소자의 외부 주변의 거리이다. 그러나, 테두리 속성 다르다.
프로파일의 일부 요소의 크기없고, 따라서, 폭과 높이의 프로파일의 폭을 포함하지 않는 요소의 속성.
예
예
div 요소 주위에 윤곽 폭, 스타일 및 색상을 변경
<!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.outline="thick solid #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.outline="thick solid #0000FF";
}
</script>
</head>
<body>
<div id="ex1">这是一些文本。</div>
<br>
<button type="button" onclick="displayResult()">修改外边框</button>
<p><b>注意:</b> IE8 支持outline属性必须制定一个!DOCTYPE </p>
</body>
</html>
»시도
스타일 개체