Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

width

Das width-Attribut definiert die horizontale Länge eines Elements im Benutzerkoordinatensystem.

Elemente

Sie können dieses Attribut mit den unten beschriebenen SVG-Elementen verwenden.

`<feBlend>`

Für <feBlend> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feColorMatrix>`

Für <feColorMatrix> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feComponentTransfer>`

Für <feComponentTransfer> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feComposite>`

Für <feComposite> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feConvolveMatrix>`

Für <feConvolveMatrix> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feDiffuseLighting>`

Für <feDiffuseLighting> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feDisplacementMap>`

Für <feDisplacementMap> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feDropShadow>`

Für <feDropShadow> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feFlood>`

Für <feFlood> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feGaussianBlur>`

Für <feGaussianBlur> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> > \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feImage>`

Für <feImage> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> > \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feMerge>`

Für <feMerge> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> > \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feMorphology>`

Für <feMorphology> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> > \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feOffset>`

Für <feOffset> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feSpecularLighting>`

Für <feSpecularLighting> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feTile>`

Für <feTile> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<feTurbulence>`

Für <feTurbulence> definiert width die horizontale Länge für den Darstellungsbereich der Primitiven.

Wert	<length> \| <percentage>
Standardwert	`100%`
Animierbar	Ja

`<filter>`

Für <filter> definiert width die horizontale Länge für den Darstellungsbereich des Filters.

Wert	<length> \| <percentage>
Standardwert	`120%`
Animierbar	Ja

`<foreignObject>`

Für <foreignObject> definiert width die horizontale Länge für den Darstellungsbereich des referenzierten Dokuments.

Wert	`auto` \| <length> \| <percentage>
Standardwert	`auto` (behandelt wie `0`)
Animierbar	Ja

Hinweis: Ab SVG2 ist width eine Geometrie-Eigenschaft, was bedeutet, dass dieses Attribut auch als CSS-Eigenschaft für <foreignObject> verwendet werden kann.

`<image>`

Für <image> definiert width die horizontale Länge des Bildes.

Wert	`auto` \| <length> \| <percentage>
Standardwert	`auto` (behandelt als die intrinsische Breite des Bildes)
Animierbar	Ja

Hinweis: Ab SVG2 ist width eine Geometrie-Eigenschaft, was bedeutet, dass dieses Attribut auch als CSS-Eigenschaft für Bilder verwendet werden kann.

`<mask>`

Für <mask> definiert width die horizontale Länge seines Wirkungsbereichs. Die genaue Wirkung dieses Attributs wird durch das maskUnits-Attribut beeinflusst.

Wert	<length> \| <percentage>
Standardwert	`120%`
Animierbar	Ja

`<pattern>`

Für <pattern> definiert width die horizontale Länge des Kachelmusters. Die genaue Wirkung dieses Attributs wird durch die Attribute patternUnits und patternTransform beeinflusst.

Wert	<length>
Standardwert	`0`
Animierbar	Ja

`<rect>`

Für <rect> definiert width die horizontale Länge für das Rechteck.

Wert	`auto` \| <length> \| <percentage>
Standardwert	`auto` (behandelt wie `0`)
Animierbar	Ja

Hinweis: Ab SVG2 ist width eine Geometrie-Eigenschaft, was bedeutet, dass dieses Attribut auch als CSS-Eigenschaft für Rechtecke verwendet werden kann.

`<svg>`

Für <svg> definiert width die horizontale Länge für den Darstellungsbereich des SVG-Viewports.

Hinweis: In einem HTML-Dokument, wenn sowohl das viewBox-Attribut als auch das width-Attribut weggelassen werden, wird das svg-Element mit einer Breite von 300px dargestellt.

Wert	`auto` \| <length> \| <percentage>
Standardwert	`auto` (behandelt wie `100%`)
Animierbar	Ja

Hinweis: Ab SVG2 ist width eine Geometrie-Eigenschaft, was bedeutet, dass dieses Attribut auch als CSS-Eigenschaft für <svg> verwendet werden kann.

`<use>`

Für <use> definiert width die horizontale Länge für das referenzierte Element.

Wert	`auto` \| <length> \| <percentage>
Standardwert	`auto` (behandelt wie `0`)
Animierbar	Ja

Hinweis: width hat keine Wirkung auf use-Elemente, es sei denn, das referenzierte Element hat einen viewBox - d.h. sie haben nur eine Wirkung, wenn use sich auf ein svg- oder symbol-Element bezieht.

Hinweis: Ab SVG2 ist width eine Geometrie-Eigenschaft, was bedeutet, dass dieses Attribut auch als CSS-Eigenschaft für verwendete Elemente verwendet werden kann.

Beispiele

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

Dieses Beispiel enthält drei <rect>-Elemente mit verschiedenen width-Attributwerten. Das erste <rect> hat width="0" gesetzt. SVG-Elemente mit einer Breite von 0 oder weniger werden nicht gerendert.

html

<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>

[フレーム]

Spezifikationen

Spezifikation
Filter Effects Module Level 1 # element-attrdef-filter-width
Filter Effects Module Level 1 # element-attrdef-filter-primitive-width
CSS Masking Module Level 1 # element-attrdef-mask-width
Scalable Vector Graphics (SVG) 2 # Sizing
Scalable Vector Graphics (SVG) 2 # PatternElementWidthAttribute

Siehe auch

CSS width Eigenschaft

Help improve MDN

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden