stroke-linecap
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2020年3月.
stroke-linecap 属性制定了，在开放子路径被设置描边的情况下，用于开放自路径两端的形状。
作为一个展现属性，它也可以在一个 CSS 样式表内部，作为一个属性直接使用。
使用背景
| 分类 | 展现属性 |
|---|---|
| 属性值 | butt | round | square | inherit |
| 可动画化 | 是 |
示例
html
<?xml version="1.0"?>
<svg
width="120"
height="120"
viewPort="0 0 120 120"
version="1.1"
xmlns="http://www.w3.org/2000/svg">
<line
stroke-linecap="butt"
x1="30"
y1="30"
x2="30"
y2="90"
stroke="black"
stroke-width="20" />
<line
stroke-linecap="round"
x1="60"
y1="30"
x2="60"
y2="90"
stroke="black"
stroke-width="20" />
<line
stroke-linecap="square"
x1="90"
y1="30"
x2="90"
y2="90"
stroke="black"
stroke-width="20" />
<path d="M30,30 L30,90 M60,30 L60,90 M90,30 L90,90" stroke="white" />
</svg>
元素
以下元素可以使用stroke-linecap 属性
规范
| Specification |
|---|
| Scalable Vector Graphics (SVG) 2 # LineCaps |