outline-width 属性用于设置元素轮廓的宽度。轮廓是一种在元素周围绘制的线条,通常用于突出显示元素,而不会影响布局。
语法
selector {
outline-width: value;
}value:可以是像素值(px)、百分比(%)、thin、medium、thick等预定义值。
值
thin:定义细轮廓。medium:定义中等宽度的轮廓。thick:定义粗轮廓。<length>:定义具体的轮廓宽度,例如1px。
示例
.btn {
outline-width: 2px;
}
.btn:focus {
outline-width: medium;
}在上面的示例中,.btn 类的元素将具有2像素宽度的轮廓,而在获得焦点时,轮廓宽度将变为中等宽度。
注意事项
- 轮廓与边框不同,轮廓不占据布局空间,不会影响元素的大小或位置。
outline-width属性必须与outline-style和outline-color属性一起使用才能生效。
使用 outline-width 属性可以轻松地自定义元素的轮廓宽度,从而增强用户体验和可访问性。