stroke-opacity

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2020.

stroke-opacity 属性指定了当前对象的轮廓的不透明度。它的默认值是 1

作为一个外观属性,它可以直接用作 CSS 样式表内部的属性。

使用说明

类别 外观属性
<opacity-value> | inherit
可变性 Yes
<opacity-value>

在当前对象的轮廓上用该涂色操作的不透明度。任何超出 0.0 到 1.0 范围的值都会被压回这个范围(0.0 表示完全透明,1.0 表示完全不透明)。

示例

SVG

html
<svg width="120px" height="120px" viewBox="0 0 120 120">
  <rect x="10" y="10" width="100" height="100" />
</svg>

CSS

css
rect {
  fill: #b4da55;
  stroke: #000;
  stroke-width: 10px;
  stroke-opacity: 0.3;
}

结果

元素

下列元素可以使用stroke-opacity属性:

规范

Specification
Scalable Vector Graphics (SVG) 2
# StrokeOpacity

参见