HTML DOM Style outline properties
Style Objects Definition and Usage
outline shorthand property to set or return all the outline properties.
grammar
Set the outline properties:
Back outline properties:
Tip: outline property has no default value.
| 参数 | 描述 |
|---|---|
| width | 设置轮廓的宽度。 |
| style | 设置轮廓的样式。 |
| color | 设置轮廓的颜色。 |
| inherit | 规定轮廓属性的值，应该从父元素继承。 |
Browser Support
All major browsers support the outline property.
Note: IE7 and earlier versions do not support the outline property.IE8 only provides! DOCTYPE supported outline attributes. IE9 support the outline property.
Tips and Notes
Contour lines around the surrounding elements. It is the distance around the outside of the display element. However, it is different from the border property.
Part of the profile is not an element size, and therefore the width and height attributes of the element does not include the width of the profile.
Examples
Examples
Around a div element change the outline width, style, and color:
<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>
try it"
Style Objects