height
height
属性定义了元素在用户坐标系统中的垂直长度。
你可以将此属性与以下 SVG 元素一起使用
<feBlend>
<feColorMatrix>
<feComponentTransfer>
<feComposite>
<feConvolveMatrix>
<feDiffuseLighting>
<feDisplacementMap>
<feDropShadow>
<feFlood>
<feGaussianBlur>
<feImage>
<feMerge>
<feMorphology>
<feOffset>
<feSpecularLighting>
<feTile>
<feTurbulence>
<filter>
<foreignObject>
<image>
<mask>
<pattern>
<rect>
<svg>
<use>
示例
<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
是一个几何属性(Geometry Property),这意味着此属性也可以作为 <foreignObject>
的 CSS 属性使用。
图片
对于 <image>
,height
定义了图像的垂直长度。
值 |
auto | <length> | <percentage> |
---|---|
默认值 | auto (视为图像的固有高度) |
可动画的 | 是 |
注意:从 SVG2 开始,height
是一个几何属性(Geometry Property),这意味着此属性也可以作为图像的 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
是一个几何属性(Geometry Property),这意味着此属性也可以作为矩形的 CSS 属性使用。
svg
对于 <svg>
,height
定义了 SVG 视口渲染区域的垂直长度。
注意:在 HTML 文档中,如果 viewBox
和 height
属性都省略了,SVG 元素的渲染高度将是 150px
值 |
auto | <length> | <percentage> |
---|---|
默认值 | auto (视为 100% ) |
可动画的 | 是 |
注意:从 SVG2 开始,height
是一个几何属性(Geometry Property),这意味着此属性也可以作为 <svg>
的 CSS 属性使用。
use
对于 <use>
,height
定义了引用元素的垂直长度。
值 |
auto | <length> | <percentage> |
---|---|
默认值 | auto (视为 0 ) |
可动画的 | 是 |
注意:height
对 use
元素没有影响,除非引用的元素具有 viewBox — 即,它们仅在 use
引用 svg
或 symbol
元素时才有效。
注意:从 SVG2 开始,height
是一个几何属性(Geometry Property),这意味着此属性也可以作为被使用元素的 CSS 属性使用。
规范
另见
- CSS
height
属性