CSS outline-style 属性

设置outline的样式：

p
{
outline-style:dotted;
}

浏览器支持

表格中的数字表示支持该属性的第一个浏览器版本号。

属性
outline-style	1.0	8.0	1.5	1.2	7.0

outline（轮廓）是绘制于元素周围的一条线，位于边框边缘的外围。

outline-style属性指定outline的样式。

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

outline不是元素尺寸的一部分，因此元素的宽度和高度属性不包含轮廓的宽度。

属性值

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

实例

<style>
p.outline {border:1px solid red;}
p.dotted {outline-style:dotted;}
p.dashed {outline-style:dashed;}
p.solid {outline-style:solid;}
p.double {outline-style:double;}
p.groove {outline-style:groove;}
p.ridge {outline-style:ridge;}
p.inset {outline-style:inset;}
p.outset {outline-style:outset;}
</style>
<p class="outline dotted">点线轮廓</p>
<p class="outline dashed">虚线轮廓</p>
<p class="outline solid">实线轮廓</p>
<p class="outline double">双线轮廓</p>
<p class="outline groove">凹槽轮廓</p>
<p class="outline ridge">垄状轮廓</p>
<p class="outline inset">嵌入轮廓</p>
<p class="outline outset">外凸轮廓</p>

效果

点线轮廓

虚线轮廓

实线轮廓

双线轮廓

凹槽轮廓

垄状轮廓

嵌入轮廓

外凸轮廓

# CSS outline-style 属性

# 浏览器支持

# 属性值

# 实例

# 相关阅读

CSS outline-style 属性

浏览器支持

属性值

实例

相关阅读