width - SVG: Scalable Vector Graphics 编辑
The width
attribute defines the horizontal length of an element in the user coordinate system.
Twenty five elements are using this attribute: <feBlend>
, <feColorMatrix>
, <feComponentTransfer>
, <feComposite>
, <feConvolveMatrix>
, <feDiffuseLighting>
, <feDisplacementMap>
, <feDropShadow>
, <feFlood>
, <feGaussianBlur>
, <feImage>
, <feMerge>
, <feMorphology>
, <feOffset>
, <feSpecularLighting>
, <feTile>
, <feTurbulence>
, <filter>
, <foreignObject>
, <image>
, <mask>
, <pattern>
, <rect>
, <svg>
, and <use>
html,body,svg { height:100% }
<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"/>
<rect x="0" y="100" width="60" height="90"/>
<rect x="0" y="200" width="100%" height="90"/>
</svg>
feBlend
For <feBlend>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feColorMatrix
For <feColorMatrix>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feComponentTransfer
For <feComponentTransfer>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feComposite
For <feComposite>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feConvolveMatrix
For <feConvolveMatrix>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feDiffuseLighting
For <feDiffuseLighting>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feDisplacementMap
For <feDisplacementMap>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feDropShadow
For <feDropShadow>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feFlood
For <feFlood>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feGaussianBlur
For <feGaussianBlur>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feImage
For <feImage>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feMerge
For <feMerge>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feMorphology
For <feMorphology>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feOffset
For <feOffset>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feSpecularLighting
For <feSpecularLighting>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feTile
For <feTile>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
feTurbulence
For <feTurbulence>
, width
defines the horizontal length for the rendering area of the primitive.
Value | <length> | <percentage> |
---|---|
Default value | 100% |
Animatable | Yes |
filter
For <filter>
, width
defines the horizontal length for the rendering area of the filter.
Value | <length> | <percentage> |
---|---|
Default value | 120% |
Animatable | Yes |
foreignObject
For <foreignObject>
, width
defines the horizontal length for the rendering area for the referenced document.
Value | auto | <length> | <percentage> |
---|---|
Default value | auto (treated as 0 ) |
Animatable | Yes |
Note: Starting with SVG2, width
is a Geometry Property meaning this attribute can also be used as a CSS property for <foreignObject>
.
image
For <image>
, width
defines the horizontal length for the image.
Value | auto | <length> | <percentage> |
---|---|
Default value | auto (treated as the intrinsic width of the image) |
Animatable | Yes |
Note: Starting with SVG2, width
is a Geometry Property meaning this attribute can also be used as a CSS property for images.
mask
For <mask>
, width
defines the horizontal length of its area of effect. The exact effect of this attribute is influenced by the maskUnits
attribute.
Value | <length> | <percentage> |
---|---|
Default value | 120% |
Animatable | Yes |
pattern
For <pattern>
, width
defines the horizontal length of the tile pattern. The exact effect of this attribute is influenced by the patternUnits
and patternTransform
attributes.
Value | <length> |
---|---|
Default value | 0 |
Animatable | Yes |
rect
For <rect>
, width
defines the horizontal length for the rectangle.
Value | auto | <length> | <percentage> |
---|---|
Default value | auto (treated as 0 ) |
Animatable | Yes |
Note: Starting with SVG2, width
is a Geometry Property meaning this attribute can also be used as a CSS property for rectangles.
svg
For <svg>
, width
defines the horizontal length for the rendering area of the SVG viewport.
Note: In an HTML document if both the viewBox
and width
attributes are omitted, the svg element will be rendered with a width of 300px
Value | auto | <length> | <percentage> |
---|---|
Default value | auto (treated as 100% ) |
Animatable | Yes |
Note: Starting with SVG2, width
is a Geometry Property meaning this attribute can also be used as a CSS property for <svg>
.
use
For <use>
, width
defines the horizontal length for the referenced element.
Value | auto | <length> | <percentage> |
---|---|
Default value | auto (treated as 0 ) |
Animatable | Yes |
Note: width
has no effect on use
elements, unless the element referenced has a viewbox - i.e. they only have an effect when use
refers to a svg
or symbol
element.
Note: Starting with SVG2, width
is a Geometry Property meaning this attribute can also be used as a CSS property for used elements.
Specifications
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
![扫码二维码加入Web技术交流群](/public/img/jiaqun_03.jpg)
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论