Latest web development tutorials

Properti HTML DOM Style outlineStyle

Gaya Referensi Obyek gaya Objects

Definisi dan Penggunaan

set properti outlineStyle atau mengembalikan elemen sekitarnya gaya garis.

tatabahasa

Pengaturan properti outlineStyle:

Object.style.outlineStyle="value"

Sifat Kembali outlineStyle:

Object.style.outlineStyle

描述
none 默认。定义无轮廓。
hidden 轮廓是关闭的。
dotted 定义点状轮廓。
dashed 定义虚线轮廓。
solid 定义实线轮廓。
double 定义双线轮廓。
groove 定义 3D 凹槽轮廓。此效果取决于 outline-color 值。
ridge 定义 3D 垄状轮廓。其效果取决于 border-color 的值。
inset 定义 3D inset 轮廓。其效果取决于 border-color 的值。
outset 定义 3D outset 轮廓。其效果取决于 border-color 的值。
inherit 轮廓的样式从父元素继承。


Dukungan Browser

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Semua browser utama mendukung properti outlineStyle.

Catatan: IE7 dan versi sebelumnya tidak mendukung properti outlineStyle.IE8 hanya menyediakan! DOCTYPE didukung properti outlineStyle. IE9 mendukung properti outlineStyle.


Tips dan Catatan

garis kontur di sekitar elemen sekitarnya. Hal ini ditampilkan dalam margin elemen sekitarnya. Namun, berbeda dengan properti perbatasan.

Bagian dari profil bukanlah ukuran elemen, dan karena itu lebar dan tinggi atribut dari elemen tidak termasuk lebar profil.


contoh

contoh

Mengubah gaya garis besar:

<!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.outlineStyle="solid";
}
</script>
</head>
<body>

<div id="ex1">这是一些文本。</div>
<br>
<button type="button" onclick="displayResult()">修改外边框style</button>
<p><b>注意:</b> IE8 支持outline属性必须指定一个!DOCTYPE </p>

</body>
</html>

Coba »


Gaya Referensi Obyek gaya Objects