CSS stroke-width 属性指定元素上笔触的宽度。
展示属性将被覆盖：例如 <path stroke-width="3px" ... ></path>。
内联样式不会被覆盖：例如 <path style="笔画宽度：3px;" ... ></path>。
stroke-width 是一个表示属性，可以应用于任何元素，但只能对以下元素有效：<altGlyph>、<circle>、<ellipse>、<ine>、<path>、<polygon>、 <polyline>、<rect>、<text>、<textPath>、<tref> 和 <tspan>。
不需要“Px”或者“em”单位。
| 初始值 | 1 |
|---|---|
| 应用于 | 形状和文本内容元素。 |
| 继承 | 可继承 |
| 可动画的 | 无效 |
| 版本 | SVG 1.1规格 |
| DOM 语法 | object.strokewidth =“0.5”; |
语法
stroke-width: length | percentage | initial | inherit;
描边宽度属性示例：
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
</head>
<body>
<h2>Stroke-width 属性示例</h2>
<svg viewBox="0 0 30 10">
<circle cx="5" cy="5" r="3" stroke="#1c87c9" stroke-width="1" />
</svg>
</body>
</html>
具有“长度”值的stroke-width属性示例：
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
</head>
<body>
<h2>Stroke-width 属性示例</h2>
<svg viewBox="0 0 30 10">
<circle cx="5" cy="5" r="3" stroke="#1c87c9" stroke-width="3" />
</svg>
</body>
</html>
带有 "%" 值的 stroke-width 属性示例：
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
</head>
<body>
<h2>Stroke-width 属性示例</h2>
<svg viewBox="0 0 30 10">
<circle cx="5" cy="5" r="3" stroke="#1c87c9" stroke-width="2%" />
</svg>
</body>
</html>
CSS stroke-width 属性值说明
| 值 | 描述 |
|---|---|
| length | 指定笔划的宽度。 |
| percentage | 指定中笔记的宽度。 |
| initial | 使属性使用其默认值。 |
| inherit | 从父母元素继承属性。 |
日期：2020-06-02 22:14:46 来源：oir作者：oir