CSS outline-style 属性

Paglilinaw at Paggamit

Ang attribute na outline-style ay ginagamit upang itakda ang estilo ng buong linya ng elementong panghaharap. Ang estilo ay hindi dapat na none, kung hindi ay hindi lumilitaw ang linya ng harap.

outline (轮廓)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用。outline 属性设置元素周围的轮廓线。

注释:请始终在 outline-color 属性之前声明 outline-style 属性。元素只有获得轮廓以后才能改变其轮廓的颜色。

注释:轮廓线不会占据空间,也不一定是矩形。

另请参阅:

CSS 教程:CSS 轮廓

CSS 参考手册:outline 属性

HTML DOM 参考手册:outlineStyle 属性

实例

设置轮廓的样式:

p
  {
  outline-style:dotted;
  }

亲自试一试

CSS 语法

outline-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;

属性值

描述
none 默认。定义无轮廓。
hidden 定义隐藏的轮廓。
dotted 定义点状轮廓。
dashed 定义虚线轮廓。
solid 定义实线轮廓。
double 定义双线轮廓。双线的宽度等同于 outline-width 的值。
groove 定义 3D 凹槽轮廓。此效果取决于 outline-color 值。
ridge 定义 3D 凸槽轮廓。此效果取决于 outline-color 值。
inset 定义 3D 凹边轮廓。此效果取决于 outline-color 值。
outset 定义 3D 凸边轮廓。此效果取决于 outline-color 值。
inherit 规定应该从父元素继承轮廓样式的设置。

技术细节

默认值: none
继承性: no
版本: CSS2
JavaScript 语法: object.style.outlineStyle="dotted"

TIY 实例

设置轮廓的样式
本例演示如何设置轮廓的样式。

浏览器支持

表格中的数字注明了完全支持该属性的首个浏览器版本。

Chrome IE / Edge Firefox Safari Opera
1.0 8.0 1.5 1.2 7.0

注释:如果规定了 !DOCTYPE,则 IE8 支持 outline 属性。