English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
SVG-Referenzhandbuch sammelt häufig verwendete SVG-Elemente sowie die Verwendungsmethoden der Elementeigenschaften, detaillierte Verwendung parameter, Beschreibungen usw.
Element | Beschreibung | Attribute |
---|---|---|
<a> | Erstellt einen SVG-Elementumgebung umgebenden Link | xlink:show xlink:actuate xlink:href target |
<altGlyph> | Ermöglicht es, Objekttext zu steuern, um spezielle Zeichen Daten darzustellen | x y dx dy rotate glyphRef format xlink:href |
<altGlyphDef> | Definiert eine Reihe von Ersatz-Symbolen für Symbolik | id |
<altGlyphItem> | Definiert eine Reihe von Ersatz-Symbolen für mögliche Symbolik | id |
<animate> | Eigenschaften ändern sich dynamisch mit der Zeit | attributeName="Zielattributname" from="起始值" to="结束值" dur="Dauer" repeatCount="动画时间将发生" |
<animateColor> | 定义随着时间的推移颜色转换 | by="相对偏移值" from="起始值" to="结束值" |
<animateMotion> | 使元素沿着动作路径移动 | calcMode="动画的插补模式。可以是39;discrete',
'linear',39;paced',39;spline'" path="运动路径" keyPoints="沿运动路径的对象目前时间应移动多远" rotate="应用旋转变换" xlink:href="一个URI引用<path>元素,它定义运动路径" |
<animateTransform> | 动画上一个目标元素变换属性,从而使动画控制平移,缩放,旋转或倾斜 | by="相对偏移值" from="起始值" to="结束值" type="类型的转换其值是随时间变化。可以是39;translate',39;scale',39;rotate',39;skewX',39;skewY'" |
<circle> | 定义一个圆 | cx="圆的x轴坐标" cy="圆的y轴坐标" r="圆的半径". 必需. + Erscheinungseigenschaften: Farbe, FillStroke, Graphics |
<clipPath> | 用于隐藏位于剪切路径以外的对象部分。定义绘制什么和什么不绘制的模具被称为剪切路径 | clip-path="引用剪贴路径和引用剪贴路径交叉" clipPathUnits="userSpaceOnUse'或'objectBoundingBox"。第二个值childern一个对象的边框,会使用掩码的一小部分单位(默认:"userSpaceOnUse")" |
<color-profile> | 指定颜色配置文件的说明(使用CSS样式文件时) | local="本地存储颜色配置文件唯一ID" name="" rendering-intent="auto|perceptual|relative-colorimetric|saturation|absolute-colorimetric" xlink:href="ICC配置文件资源URI" |
<cursor> | 定义一个独立于平台的自定义光标 | x="x轴左上角光标(默认为0)" y="y轴的左上角光标(默认为0)" xlink:href="使用光标图像URI |
<defs> | 引用的元素容器 | |
<desc> | Reine Textbeschreibung von Elementen in SVG - wird nicht als Teil des Grafikinhalts angezeigt. Der Benutzeragent zeigt es als Tooltip an | |
<ellipse> | Definiert eine Ellipse | cx="x-Koordinate der Ellipse" cy="y-Koordinate der Ellipse" rx="Radius der länglichen Ellipse entlang der x-Achse". Muss vorhanden sein. ry="Radius der länglichen Ellipse entlang der y-Achse". Muss vorhanden sein. + Erscheinungseigenschaften: Farbe, FillStroke, Graphics |
<feBlend> | Verwenden verschiedener Mischmuster, um zwei Objekte zusammenzusetzen | mode="Bilddurchmischungsmuster: normal|multiply|screen|darken|lighten" in="gekennzeichnete Originalinput für den gegebenen Filter: SourceGraphic | SourceAlpha | BackgroundImage | BackgroundAlpha | FillPaint | StrokePaint | <filter-primitive-reference>" in2="Bewegung der zweiten Eingabeimage-Mischung" |
feColorMatrix | SVG-Filter. Verwendet Matrix-Transformationen | |
feComponentTransfer | SVG-Filter. Führt die Datenkomponente aus-weiser Remapping | |
feComposite | SVG-Filter | |
feConvolveMatrix | SVG-Filter | |
feDiffuseLighting | SVG-Filter | |
feDisplacementMap | SVG-Filter | |
feDistantLight | SVG-Filter. Definiert eine Lichtquelle | |
feFlood | SVG-Filter | |
feFuncA | SVG-Filter. Unterobjekt von feComponentTransfer | |
feFuncB | SVG-Filter. Unterobjekt von feComponentTransfer | |
feFuncG | SVG-Filter. Unterobjekt von feComponentTransfer | |
feFuncR | SVG-Filter. Unterobjekt von feComponentTransfer | |
feGaussianBlur | SVG-Filter. Führt eine Gaussische Verzerrung auf das Bild aus | |
feImage | SVG-Filter. | |
feMerge | SVG-Filter. Baut auf übereinander liegenden Bildschichten auf | |
feMergeNode | SVG-Filter. Unterobjekt von feMerge | |
feMorphology | SVG-Filter. Führt "Verdicken" oder "Verdünnen" auf die Quelle aus | |
feOffset | SVG-Filter. Bewegt das Bild relativ zu seinem aktuellen Position | |
fePointLight | SVG-Filter | |
feSpecularLighting | SVG-Filter | |
feSpotLight | SVG-Filter | |
feTile | SVG-Filter | |
feTurbulence | SVG-Filter | |
filter | Behälter für Filtereffekte | |
font | Definition des Zeichensatzes | |
font-face | Beschreibung der Eigenschaften eines Zeichensatzes | |
font-face-format | ||
font-face-name | ||
font-face-src | ||
font-face-uri | ||
foreignObject | ||
<g> | 用于把相关元素进行组合的容器元素 | id="该组的名称" fill="该组填充颜色" opacity="该组不透明度" + Erscheinungsattribute: All |
glyph | 为给定的象形符号定义图形 | |
glyphRef | 定义要使用的可能的象形符号 | |
hkern | ||
<image> | 定义图像 | x="BildobereLinkskante-x-Achsenkoordinate" y="BildobereLinkskante-y-Achsenkoordinate" width="Bildbreite". Muss. height="Bildhöhe". Muss. xlink:href="Bildpfad". Muss. + Erscheinungsattribute: Color, Graphics, Images, Viewports |
<line> | 定义一条线 | x1="Geradengestartpunkt-x-Koordinate" y1="Geradengestartpunkty-Koordinate" x2="Geradensendetpunkt-x-Koordinate" y2="Geradensendetpunkty-Koordinate" + Erscheinungsattribute: Color, FillStroke, Graphics, Markers |
<linearGradient> | 定义线性渐变。通过使用矢量线性渐变填充对象,并可以定义为水平,垂直或角渐变。 | id="id kann für den Farbverlauf einen eindeutigen Namen definieren. Der Verweis muss" gradientUnits="#39;userSpaceOnUse#39; oder #39;objectBoundingBox#39;.使用视图框或对象,以确定相对位置矢量点。 (默认为'objectBoundingBox" gradientTransform="Für den Farbverlauf anwendbare Transformation" x1="Farbverlaufstartpunkt der X-Achse des Farbverlaufvektors (Standard 0%)" y1="Farbverlaufstartpunkt der Y-Achse des Farbverlaufvektors (Standard 0%)" x2="Farbverlaufsendpunkt der X-Achse des Farbverlaufvektors. (Standard100%)" y2="Farbverlaufsendpunkt der Y-Achse der Farbverlaufvektor. (Standardwert 0%)" spreadMethod="#39;pad#39; oder #39;reflect#39; oder #39;repeat#39;" xlink:href="Verweis auf eine andere Farbverlauf, deren Attributwerte verwendet werden als defaults and stops included. Recursive" |
<marker> | 标记可以放在直线,折线,多边形和路径的顶点。这些元素可以使用marker属性的"marker-start","marker-mid"和"marker-end",继承默认情况下或可设置为"none"或定义的标记的URI。您必须先定义标记,然后才可以通过其URI引用。任何一种形状,可以把标记放在里面。他们绘制元素时把它们附加到顶部 | markerUnits="strokeWidth'或'userSpaceOnUse"。如果是strokeWidth"那么使用一个单位等于一个笔划宽度。否则,标记尺度不会使用同一视图单位作为引用元素(默认为'strokeWidth')" refx="Markierung der Position der Verbindungspunkte (Standardwert 0)" refy="标记顶点连接的位置(默认为0)" orient="'auto'始终显示标记的角度。 "auto"将计算某个角度使得X轴一个顶点的正切值(默认为0) markerWidth="标记的宽度(默认3)" markerHeight="标记的高度(默认3)" viewBox="各点"看到"这个SVG绘图区域。由空格或逗号分隔的4个值。(min x, min y, width, height)" + presentation attributes: All |
<mask> | 度屏蔽是一种不透明度值的组合和裁剪。像裁剪,您可以使用图形,文字或路径定义掩码的部分。一个掩码的默认状态是完全透明的,也就是裁剪平面的对面的。在掩码的图形设置掩码的不透明部分 | maskUnits="'userSpaceOnUse#39; oder #39;objectBoundingBox#39;.设定裁剪面是否是相对完整的视窗或对象(默认:'objectBoundingBox#39;)" maskContentUnits="第二个掩码相对对象的图形位置使用百分比'userSpaceOnUse#39;或'objectBoundingBox#39;(默认:'userSpaceOnUse#39;)" x="裁剪面掩码(默认值:-10%)" y="裁剪面掩码(默认值:-10%)" width="裁剪面掩码(默认是:120%)" height="裁剪面掩码(默认是:120%)" |
metadata | 指定元数据 | |
missing-glyph | ||
mpath | ||
<path> | 定义一个路径 | d="定义路径指令" pathLength="如果存在,路径将进行缩放,以便计算各点相当于此值的路径长度" transform="转换列表" + Erscheinungsattribute: Color, FillStroke, Graphics, Markers |
<pattern> | 定义坐标,你想要的视图显示和视图的大小。然后添加到您的模式形状。该模式命中时重复视图框的边缘(可视范围) | id="用于引用这个模式的唯一ID。"必需的。 patternUnits="userSpaceOnUse'或'objectBoundingBox"。第二个值X,Y,width,height 一个会使用模式对象的边框的小部分,单位(%)。" patternContentUnits="'userSpaceOnUse#39;或 'objectBoundingBox#39;" patternTransform="允许整个表达式进行转换" x="模式的偏移量,来自左上角(默认为0)" y="模式的偏移量,来自左上角(默认为0)" width="模式平铺的宽度(默认为100%)" height="模式平铺的高度(默认为100%)" viewBox="各点"看到"这个SVG绘图区域。由空格或逗号分隔的4个值。(min x, min y, width, height)" xlink:href="另一种模式,其属性值是默认值以及任何子类可以继承。递归" |
<polygon> | 定义一个包含至少三边图形 | points="多边形的点。点的总数必须是偶数"。必需的。 fill-rule="FillStroke演示属性的部分" + Erscheinungsattribute: Color, FillStroke, Graphics, Markers |
<polyline> | 定义只有直线组成的任意形状 | points=折线上的"点"。必需的。 + Erscheinungsattribute: Color, FillStroke, Graphics, Markers |
<radialGradient> | 定义放射性渐变。放射性渐变创建一个圆圈 | gradientUnits="#39;userSpaceOnUse#39; oder #39;objectBoundingBox#39. 使用视图框或对象以确定相对位置的矢量点。 (默认为#39;objectBoundingBox" gradientTransform="适用于渐变的变换" cx="渐变的中心点(数字或% - 50%是默认)" cy="渐变的中心点。 (默认50%)" r="渐变的半径。 (默认50%)" fx="渐变的焦点。 (默认0%)" fy="渐变的焦点。 (默认0%)" spreadMethod="#39;pad#39; oder #39;reflect#39; oder #39;repeat#39;" xlink:href="引用到另一个渐变,其属性值作为默认值。递归" |
<rect> | 定义一个矩形 | x="矩形的左上角的x轴" y="矩形的左上角的y轴" rx="x轴的半径(round元素)" ry="y轴的半径(round元素)" width="矩形的宽度"。必需的。 height="矩形的高度"。必需的。 + Erscheinungsattribute: Color, FillStroke, Graphics |
script | 脚本容器。(例如ECMAScript) | |
set | 设置一个属性值指定时间 | |
<stop> | 渐变停止 | offset="偏移停止(0到1/0%到100%)". 参考 stop-color="这个stop的颜色" stop-opacity="这个Stop的不透明度 (0到1)" |
style | 可使样式表直接嵌入SVG内容内部 | |
<svg> | 创建一个SVG文档片段 | x="左上角嵌入(默认为0)" y="左上角嵌入(默认为0)" width="SVG片段的宽度(默认为100%)" height="Höhe des SVG-Fragmentes (Standard von}100%)" viewBox="Punkt "seen" dieser SVG-Zeichengebiet. Getrennt durch Leerzeichen oder Kommas4Werte. (min x, min y, Breite, Höhe)" preserveAspectRatio="#39;none#39; oder jede #39;xVALYVAL#39; des9Art der Kombination, VAL ist "min", "mid" oder "max". (Standard: none) zoomAndPan="#39;magnify#39; oder #39;disable#39;.Magnify-Option ermöglicht es dem Benutzer, Ihre Datei zu verschieben und zu skalieren (Standard: Magnify )" xml="Die äußeren <svg>-Elemente müssen SVG und seinen Namensraum installieren: xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"" + Erscheinungsattribute: All |
switch | ||
symbol | ||
<text> | Definiert einen Text | x="X-Achsenposition der Liste -Position der Achse. In Text im n-ten Zeichenposition ist der n-te x-Achsenposition. Wenn zusätzliche Zeichen vorhanden sind, werden sie in der Position des letzten Zeichens platziert. 0 ist Standard" y="Y-Achsenposition der Liste. (Bezug auf x) 0 ist Standard" dx="Absolute Position im Längenverzeichnis des Zeichens, relativ zur letzten gezeichneten Markierung. (Bezug auf x)" dy="Absolute Position im Längenverzeichnis des Zeichens, relativ zur letzten gezeichneten Markierung. (Bezug auf x)" rotate="Liste der Drehungen. Die Drehung des n-ten Zeichens ist die n-te. Zusätzliche Zeichen haben keine letzte Drehungswert angegeben" textLength="Der SVG-Betrachter versucht, den Abstand zwischen den Texten anzuzeigen/oder Textzielgröße der Zeichensätze anzupassen. (Standard: Länge des normalen Textes)" lengthAdjust="informiert den Betrachter, dass versucht wird, die angegebene Länge anzupassen, um den Text darzustellen. Diese Werte sind #39;spacing#39; und #39;spacingAndGlyphs#39;" + Erscheinungsattribute: Farbe, Füllung und Umrandung, Grafik, Schriftspezifikation, Textinhaltselemente |
textPath | ||
title | Reine Textbeschreibung von Elementen in SVG - wird nicht als Teil des Grafikinhalts angezeigt. Der Benutzeragent zeigt es als Tooltip an | |
<tref> | Verwendung und Wiederverwendung jeglicher <text>-Elemente aus jedem SVG-Dokument | derselbe <TEXT>-Element |
<tspan> | Das Element ist identisch mit <text>, aber es kann Textmarken im Inneren und Text selbst einfügen | Identisch mit dem <text> Element + zusätzlich: xlink:href="Referenz auf ein <TEXT> Element" |
<use> | Verwenden Sie eine URI, um ein <G>, <svg> oder anderes Element mit einem eindeutigen ID-Attribut und wiederholten Grafikelement zu referenzieren. Die Kopie ist das ursprüngliche Element, daher ist die im Dokument ursprünglich vorhandene nur ein Referenz. Jegliche Änderungen, die den Ursprung beeinflussen, beeinflussen alle Kopien. | x="x-Achse des linken oberen Ecks des geklonten Elements" y="y-Achse des linken oberen Ecks des geklonten Elements" width="Breite des geklonten Elements" height="Höhe des geklonten Elements" xlink:href="URI-Referenz für Elementklon" + Erscheinungsattribute: All |
view | ||
vkern |