目录

CSS outline-width 属性


示例

设置轮廓的宽度:

div {outline-width: thick;}
亲自试一试 »

下面有更多 "亲自试一试" 示例。


定义和用法

轮廓是在元素周围、边框之外绘制的一条线,以使元素"stand out"。

这个outline-width指定轮廓的宽度。

笔记:始终声明轮廓式之前的属性 outline-width属性。在更改元素的宽度之前,该元素必须具有轮廓。

展示演示❯

默认值: 中等的
遗传:
可动画: 是的,查看各个属性阅读可动画的尝试一下
版本: CSS2
JavaScript 语法: 对象.style.outlineWidth="12px"尝试一下

提示和注释

笔记:轮廓不同于边界!与边框不同,轮廓是在元素边框之外绘制的,并且可能与其他内容重叠。此外,轮廓不是元素尺寸的一部分;它是元素尺寸的一部分。元素的总宽度和高度不受轮廓宽度的影响。


浏览器支持

表中的数字指定完全支持该属性的第一个浏览器版本。

Property
outline-width 1.0 8.0 1.5 1.2 7.0


CSS 语法

outline-width: medium|thin|thick| length|initial|inherit;

属性值

Value Description Demo
medium Specifies a medium outline. This is default Demo ❯
thin Specifies a thin outline Demo ❯
thick Specifies a thick outline Demo ❯
length Allows you to define the thickness of the outline. Read about length units Demo ❯
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit

更多示例

示例

将轮廓宽度设置为中等(这是默认值):

div {outline-width: medium;}
亲自试一试 »

示例

将轮廓的宽度设置为细:

div {outline-width: thin;}
亲自试一试 »

示例

将轮廓的宽度设置为 1px:

div {outline-width: 1px;}
亲自试一试 »

示例

将轮廓宽度设置为 15px:

div {outline-width: 15px;}
亲自试一试 »

相关页面

CSS教程:CSS 外轮廓

CSS 参考:外轮廓属性

HTML DOM 参考:轮廓宽度属性