height

**height** 屬性在使用者座標系中定義元素的垂直長度。

您可以將此屬性與以下 SVG 元素一起使用

示例

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

html

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

feBlend

對於 <feBlend>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feColorMatrix

對於 <feColorMatrix>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feComponentTransfer

對於 <feComponentTransfer>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feComposite

對於 <feComposite>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feConvolveMatrix

對於 <feConvolveMatrix>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feDiffuseLighting

對於 <feDiffuseLighting>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feDisplacementMap

對於 <feDisplacementMap>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feDropShadow

對於 <feDropShadow>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feFlood

對於 <feFlood>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feGaussianBlur

對於 <feGaussianBlur>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feImage

對於 <feImage>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feMerge

對於 <feMerge>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feMorphology

對於 <feMorphology>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feOffset

對於 <feOffset>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feSpecularLighting

對於 <feSpecularLighting>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feTile

對於 <feTile>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

feTurbulence

對於 <feTurbulence>，height 定義基元的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`100%`
可動畫	是

filter

對於 <filter>，height 定義過濾器的渲染區域的垂直長度。

值	<length> \| <percentage>
預設值	`120%`
可動畫	是

foreignObject

對於 <foreignObject>，height 定義引用的文件的渲染區域的垂直長度。

值	`auto` \| <length> \| <percentage>
預設值	`auto`（視為 `0`）
可動畫	是

注意：從 SVG2 開始，height 是一個幾何屬性，這意味著此屬性也可以用作 <foreignObject> 的 CSS 屬性。

image

對於 <image>，height 定義影像的垂直長度。

值	`auto` \| <length> \| <percentage>
預設值	`auto`（視為影像的固有高度）
可動畫	是

注意：從 SVG2 開始，height 是一個幾何屬性，這意味著此屬性也可以用作影像的 CSS 屬性。

mask

對於 <mask>，height 定義其影響區域的垂直長度。此屬性的確切效果受 maskUnits 屬性的影響。

值	<length> \| <percentage>
預設值	`120%`
可動畫	是

pattern

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

值	<length>
預設值	`0`
可動畫	是

rect

對於 <rect>，height 定義矩形的垂直長度。

值	`auto` \| <length> \| <percentage>
預設值	`auto`（視為 `0`）
可動畫	是

注意：從 SVG2 開始，height 是一個幾何屬性，這意味著此屬性也可以用作矩形的 CSS 屬性。

svg

對於 <svg>，height 定義 SVG 視口的渲染區域的垂直長度。

注意：在 HTML 文件中，如果同時省略了viewBox 和 height 屬性，svg 元素將以 150px 的高度渲染

值	`auto` \| <length> \| <percentage>
預設值	`auto`（視為 `100%`）
可動畫	是

注意：從 SVG2 開始，height 是一個幾何屬性，這意味著此屬性也可以用作 <svg> 的 CSS 屬性。

use

對於 <use>，height 定義了所引用元素的垂直長度。

值	`auto` \| <length> \| <percentage>
預設值	`auto`（視為 `0`）
可動畫	是

注意：height 對 use 元素沒有影響，除非所引用元素具有 viewBox - 即，只有當 use 引用 svg 或 symbol 元素時，它們才會產生影響。

注意：從 SVG2 開始，height 是一個幾何屬性，這意味著此屬性也可以用作已使用元素的 CSS 屬性。

規範

規範
濾鏡效果模組級別 1 # element-attrdef-filter-height
濾鏡效果模組級別 1 # element-attrdef-filter-primitive-height
CSS 遮罩模組級別 1 # element-attrdef-mask-height
可縮放向量圖形 (SVG) 2 # 大小調整
可縮放向量圖形 (SVG) 2 # PatternElementHeightAttribute