寬度

您可以將此屬性與以下部分中描述的 SVG 元素一起使用。

對於 <feBlend>，width 定義基元的渲染區域的水平長度。

對於 <feColorMatrix>，width 定義基元的渲染區域的水平長度。

對於 <feComponentTransfer>，width 定義基元的渲染區域的水平長度。

對於 <feComposite>，width 定義基元的渲染區域的水平長度。

對於 <feConvolveMatrix>，width 定義基元的渲染區域的水平長度。

對於 <feDiffuseLighting>，width 定義基元的渲染區域的水平長度。

對於 <feDisplacementMap>，width 定義基元的渲染區域的水平長度。

對於 <feDropShadow>，width 定義基元的渲染區域的水平長度。

對於 <feFlood>，width 定義基元的渲染區域的水平長度。

對於 <feGaussianBlur>，width 定義基元的渲染區域的水平長度。

對於 <feImage>，width 定義基元的渲染區域的水平長度。

對於 <feMerge>，width 定義基元的渲染區域的水平長度。

對於 <feMorphology>，width 定義基元的渲染區域的水平長度。

對於 <feOffset>，width 定義基元的渲染區域的水平長度。

對於 <feSpecularLighting>，width 定義基元的渲染區域的水平長度。

對於 <feTile>，width 定義基元的渲染區域的水平長度。

對於 <feTurbulence>，width 定義基元的渲染區域的水平長度。

對於 <filter>，width 定義過濾器的渲染區域的水平長度。

對於 <foreignObject>，width 定義引用的文件的渲染區域的水平長度。

對於 <image>，width 定義影像的水平長度。

對於 <mask>，width 定義其影響區域的水平長度。此屬性的確切效果會受到 maskUnits 屬性的影響。

對於 <pattern>，width 定義平鋪圖案的水平長度。此屬性的確切效果會受到 patternUnits 和 patternTransform 屬性的影響。

對於 <rect>，width 定義矩形的水平長度。

對於 <svg>，width 定義 SVG 視窗的渲染區域的水平長度。

對於 <use>，width 定義了引用元素的水平長度。

html,
body,
svg {
  height: 100%;
}

此示例包含三個 <rect> 元素，它們具有不同的 width 屬性值。第一個 <rect> 設定了 width="0"。寬度為 0 或更小的 SVG 元素不會呈現。

<svg viewBox="0 0 100 300" xmlns="http://www.w3.org/2000/svg">
  <!-- With a width of 0 or less, nothing will be rendered -->
  <rect
    x="0"
    y="0"
    width="0"
    height="90"
    fill="red"
    stroke-width="5"
    stroke="black" />
  <rect
    x="0"
    y="100"
    width="60"
    height="90"
    fill="red"
    stroke-width="5"
    stroke="black" />
  <rect
    x="0"
    y="200"
    width="100%"
    height="90"
    fill="red"
    stroke-width="5"
    stroke="black" />
</svg>