轻松上手,快乐学习!

Style outline 属性


实例

围绕一个 div 元素更改轮廓的宽度、样式和颜色:

document.getElementById("myDiv").style.outline = "thick solid #0000FF";
亲自试一试 »

定义和用法

outline 属性以速记形式设置或返回所有的轮廓属性。

使用此属性,可以设置/返回以下一项或多项(按任意顺序):

  • outline-width
  • outline-style
  • outline-color

轮廓是围绕元素周围的线条。它是显示在元素的 margin 的周围。但是,它与 border 属性不同。

轮廓不是元素尺寸的一部分,因此元素的 width 和 height 属性不包含轮廓的宽度。


浏览器支持

属性
outline Yes Yes Yes Yes Yes

语法

返回 outline 属性:

object.style.outline

设置 outline 属性:

object.style.outline = "width style color|initial|inherit"

属性值

参数 描述
width 设置轮廓的宽度。
style 设置轮廓的样式。
color 设置轮廓的颜色。
initial 设置该属性为它的默认值。请参阅 initial
inherit 从父元素继承该属性。请参阅 inherit

技术细节

默认值: medium none invert
返回值: 字符串,表示元素的轮廓宽度、样式或颜色
CSS 版本 CSS2

更多实例

实例

更改 <div> 元素轮廓的宽度、样式和颜色:

document.getElementById("myDiv").style.outline = "5px dotted green";
亲自试一试 »

实例

返回 <div> 元素的轮廓属性值:

alert(document.getElementById("myDiv").style.outline);
亲自试一试 »

相关页面

CSS 教程: CSS Outline

CSS 参考手册: outline 属性


❮ Style 对象