Style outline 屬性

Style 對象

定義和用法

outline 屬性以速記形式設(shè)置或返回所有的輪廓屬性。

語法

設(shè)置 outline 屬性：

Object.style.outline="width style color|inherit"

返回 outline 屬性：

Object.style.outline

提示：outline 屬性沒有默認(rèn)值。

參數(shù)	描述
width	設(shè)置輪廓的寬度。
style	設(shè)置輪廓的樣式。
color	設(shè)置輪廓的顏色。
inherit	規(guī)定輪廓屬性的值，應(yīng)該從父元素繼承。

瀏覽器支持

所有主要瀏覽器都支持 outline 屬性。

注意：IE7 及更早的版本不支持 outline 屬性。IE8 只有規(guī)定了 !DOCTYPE 才支持 outline 屬性。IE9 支持 outline 屬性。

提示和注釋

輪廓是圍繞元素周圍的線條。它是顯示在元素的外邊距的周圍。但是，它與 border 屬性不同。

輪廓不是元素尺寸的一部分，因此元素的 width 和 height 屬性不包含輪廓的寬度。

實(shí)例

圍繞一個(gè) div 元素更改輪廓的寬度、樣式和顏色：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>小白教程(json.cn)</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屬性必須制定一個(gè)!DOCTYPE </p>

</body>
</html>

運(yùn)行代碼 ?

Style 對象其他擴(kuò)展

上一篇：Style orphans 屬性下一篇：Style outlineColor 屬性