SVG-Referenzhandbuch
SVG Element
| Element | Erklärung | Immobilien |
|---|---|---|
| <a> | Erstellen Sie einen Link um SVG-Element | xlink: anzeigen xlink: actuate xlink: href Ziel |
| <AltGlyph> | Gibt einem Objekt des Textes steuert spezielle Zeichendaten zu machen | x y dx dy drehen glyphRef Format xlink: href |
| <AltGlyphDef> | Es ist als eine Reihe von Symbolen definiert, zu ersetzen | Identifikation |
| <AltGlyphItem> | Ersetzen Sie die Definition einer Reihe von Symbolen wie der Kandidat | Identifikation |
| <Animate> | Dynamische Veränderung der Eigenschaften im Laufe der Zeit | attribute = "target Attribut name" from = "Startwert" to = "Endwert" dur = "Dauer" repeat = "Zeitanimation auftreten wird." |
| <AnimateColor> | Im Laufe der Zeit die Definition der Farbumwandlungs | by = "Relative Offset-Wert" from = "Startwert" to = "Endwert" |
| <AnimateMotion> | Damit das Element bewegt sich entlang der Bewegungsbahn | calcMode = "Animation Interpolationsmodus kann" diskrete "sein," linear "," Tempo "," Spline ' " path = "Pfad der Bewegung" keypoints = "entlang der Bewegungsbahn des Gegenstandes der vorliegenden Zeit sollte weit bewegt werden." drehen = "eine Rotationstransformation anzuwenden." xlink: href = "URI verweist auf ein <Pfad> Element, das den Bewegungspfad definiert." |
| <AnimateTransform> | Animationszielelement eine Eigenschaft verwandeln, so dass die Animationssteuerung schwenken, zoomen, drehen oder kippen | by = "Relative Offset-Wert" from = "Startwert" to = "Endwert" type = "konvertierte Typ, deren Werte sich im Laufe der Zeit 'übersetzen', 'Skala', 'drehen', 'skewX', 'skewY' sein" |
| <Kreis> | Die Definition eines Kreises | cx = "x-Achse des Kreises zu koordinieren." cy = "y-Achse des Kreises zu koordinieren." r = "Radius des Kreises." Erforderlich. + Show Attribute: Farbe, fillstroke, Grafiken |
| <ClipPath> | Gebrauchte Objekte zu verbergen außerhalb des Beschneidungspfad Abschnitts angeordnet. Zeichnen und was wird nicht definiert, was der Chip Beschneidungspfad Zeichnung genannt wird | Clip-path = "Referenzen und Verweise Beschneidungspfad Clipping-Pfade kreuzen." clipPathUnits = "userSpaceOnUse" oder "objectBoundingBox". Der zweite Wert childern Grenze eines Objekts, einen kleinen Teil der Maskeneinheit (Standard: "userSpaceOnUse") mit " |
| <Farbe-profile> | Beschreibung angegebene Farbprofil (wenn CSS-Style-Datei) | local = "Farbprofil gespeichert lokal eindeutige ID" name = "" Rendering-Intent = "auto | Wahrnehmungs | relative farbmetrische | Sättigung | absolute-farbmetrisch" xlink: href = "ICC-Profil Ressource URI" |
| <Cursor> | Definieren Sie eine plattformunabhängige benutzerdefinierten Cursor | x = "x-Achse oberen linken Ecke des Cursors (die Standardeinstellung ist 0)." y = "y-Achse der oberen linken Ecke des Cursors (die Standardeinstellung ist 0)." xlink: href = "Verwenden Sie den Cursor Bild URI |
| <Defs> | Container-Element Referenz | |
| <Desc> | Reine Elemente in SVG Textbeschreibung - nicht als Teil der Grafik angezeigt werden soll. Benutzerprogramme können als Tooltip angezeigt werden | |
| <Ellipse> | Die Definition einer Ellipse | cx = "oval x-Achsen-Koordinate" cy = "oval y-Achsen-Koordinate" rx = "entlang der x-Achse der Ellipse Radius." Erforderlich. ry = "länglich entlang der y-Achse Radius." Erforderlich. + Show Attribute: Farbe, fillstroke, Grafiken |
| <FeBlend> | Mit Hilfe verschiedener Füllmethoden auf die Synthese von zwei Objekten zusammen | mode = "Bild Blending-Modi: Normal | multiplizieren | Bildschirm | verdunkeln | aufhellen" in = "als das gegebene Filter Roh-Eingangs identifiziert: SourceGraphic | SourceAlpha | Background | background | FillPaint | StrokePaint | <filter-primitive Verweis>" in2 = "zweiten Eingangsbild Mischvorgang." |
| feColorMatrix | SVG-Filter. Geeignete Matrix-Transformation | |
| feComponentTransfer | SVG-Filter. Ausführungsdaten komponentenweise Remapping | |
| feComposite | SVG-Filter | |
| feConvolveMatrix | SVG-Filter | |
| feDiffuseLighting | SVG-Filter | |
| feDisplacementMap | SVG-Filter | |
| feDistantLight | SVG-Filter. Die Definition einer Lichtquelle | |
| feFlood | SVG-Filter | |
| feFuncA | SVG-Filter. feComponentTransfer Kind-Elemente | |
| feFuncB | SVG-Filter. feComponentTransfer Kind-Elemente | |
| feFuncG | SVG-Filter. feComponentTransfer Kind-Elemente | |
| feFuncR | SVG-Filter. feComponentTransfer Kind-Elemente | |
| feGaussianBlur | SVG-Filter. Vorstand Gaußsche Unschärfe Bild | |
| feImage | SVG-Filter. | |
| feMerge | SVG-Filter. Aufbauend auf der jeweils anderen Bildschicht | |
| feMergeNode | SVG-Filter. feMerge Kind-Elemente | |
| feMorphology | SVG-Filter. Die Umsetzung der "Mast" oder "Verdünnung" Graphics-Quell | |
| feOffset | SVG-Filter. Relativ zu ihrer aktuellen Position eines sich bewegenden Bildes | |
| fePointLight | SVG-Filter | |
| feSpecularLighting | SVG-Filter | |
| feSpotLight | SVG-Filter | |
| feTile | SVG-Filter | |
| feTurbulence | SVG-Filter | |
| Filter | Container-Filter-Effekte | |
| Schriftart | Benutzerdefinierte Schriftarten | |
| font-face | Beschreiben die Eigenschaften einer Schriftart | |
| font-face-Format | ||
| font-face-name | ||
| font-face-src | ||
| font-face-uri | ||
| foreign | ||
| <G> | Behälterelement für die Kombination der zugehörigen Elemente | id = "Name der Gruppe." füllen = "Farbe der Gruppe zu füllen." Opazität = "Die Gruppe Opazität" + Anzeigen Eigenschaften: alle |
| Glyphe | Für eine gegebene Hieroglyphe eigene Grafiken | |
| glyphRef | Pictograph Definition verwendet werden | |
| hkern | ||
| <Bild> | Eigenes Bild | x = "x-Achse der oberen linken Ecke des Bildes zu koordinieren." y = "y-Achse der oberen linken Ecke des Bildes zu koordinieren." width = "Breite des Bildes." Muss. height = "Höhe des Bildes." Muss. xlink :. href = "Bildpfad" Muss. + Anzeigen Eigenschaften: Farbe, Grafiken, Bilder, Ansichtsfenstern |
| <Line> | Definieren Sie eine Linie | x1 = "x-Koordinate des Startpunkts einer geraden Linie." y1 = "y-Koordinaten des Startpunkts einer geraden Linie." x2 = "x-Koordinate der Geraden Endpunkt". y2 = "y der Geraden Endpunkt zu koordinieren." + Anzeigen Eigenschaften: Farbe, fillstroke, Grafik, Marker |
| <LinearGradient> | Definieren eines linearen Gradienten. Durch die Verwendung eines linearen Gradienten füllen Vektorobjekten und kann als horizontal, vertikal oder Winkel Gradienten festgelegt werden. | id = "id-Attribut kann einen eindeutigen Namen für den Gradienten definieren. Referenzen Muss" gradientUnits = " 'userSpaceOnUse" oder "objectBoundingBox". Verwenden Sie das Ansichtsfeld oder das Objekt der relativen Positionsvektor Punkt zu bestimmen. (default' objectBoundingBox) " gradientTransform = "gilt die Steigung zu ändern" x1 = "x Gradientenvektor Startpunkt (default 0%)" y1 = "y Gradientenvektor Startpunkt (default 0%)" x2 = "das Ende des Gradienten Vektor x. (Standard 100%)" y2 = "das Ende des Gradienten Vektor y. (default 0%)" spread = "" Pad "oder" spiegeln "oder" Repeat "" xlink: href = "Verweis auf eine andere Steigung, deren Attributwerte verwendet werden als Standardwerte und Anschläge rekursive enthalten." |
| <Marker> | Tag können auf den Scheitellinien, Polylinien, Polygone und Pfade gesetzt werden. Diese Elemente können verwendet werden Maeker Eigenschaft "Maeker-Start", "Maeker-Mitte" und "Maeker-end", Inherit standardmäßig oder auf URI "none" oder definierte Tags gesetzt werden. Sie müssen das Tag definieren, bevor sie durch den URI verwiesen werden kann. Jede Art von Form, können Sie Tags auf der nach innen setzen. Wenn sie die Elemente ziehen sie an die Spitze zu befestigen | markerUnits = "stroke" oder "userSpaceOnUse". Wenn stroke ", dann ist die Verwendung einer Einheit gleich der Breite eines Schlaganfalls. Ansonsten verwenden Sie nicht den gleichen Tag angelegte Ansicht der Einheit als Referenzelement (standardmäßig 'stroke')" reFX = "Platzmarkierung Vertex-Verbindungen (die Standardeinstellung ist 0)." REFY = "Platzmarkierung Vertex-Verbindungen (die Standardeinstellung ist 0)." orient = " 'auto' immer Zeichen Anzeigewinkel." auto "in einem Winkel berechnet wird, so dass der X-Achse eines Scheiteltangente (Standardeinstellung ist 0) markerWidth = "Breite markiert (Standard 3)." markerHeight = "Höhe markiert (Standard 3)." viewBox = "Punkte" gesehen "diese SVG-Zeichenfläche. 4 durch Leerzeichen getrennte Werte oder Komma. (min x, y min, Breite, Höhe)" + Präsentation Attribute: alle |
| <Maske> | Abschirmung ist eine Kombination aus spanlos und Transparenzwerte. Wie Zuschneiden, können Sie einige Grafiken, Text oder Pfad definiert Maske verwenden. Der Standardzustand einer Maske ist vollständig transparent, dass das Gegenteil der Clipping-Ebene ist. In dem undurchsichtigen Teil des Maskenmusters Einstellungen Maske | maskUnits = "." userSpaceOnUse "oder" objectBoundingBox 'eingestellt werden, ob Ebene Clipping relativ intakte Fenster oder Objekt (Standard:' objectBoundingBox ') " maskContentUnits = "zweite Maskenstruktur relativ Objektposition Prozent 'userSpaceOnUse' oder 'objectBoundingBox' (Standard: 'userSpaceOnUse') mit" x = "Clippingebene Maske (Standard: -10%)." y = "Clippingebene Maske (Standard: -10%)." width = "Clippingebene Maske (Standard: 120%)." height = "Clippingebene Maske (Standard: 120%)." |
| Metadaten | Spezifizierte Meta-Daten | |
| fehlende-Glyphe | ||
| mpath | ||
| <Pfad> | Definieren Sie einen Pfad | d = "Pfad definierten Befehl" pathLength = "Wenn ja, wird der Weg, um skaliert werden, um den Punktwert gleich der Länge dieses Pfades zu berechnen" Transformation = "Konvertierungsliste" + Anzeigen Eigenschaften: Farbe, fillstroke, Grafik, Marker |
| <Pattern> | DET, Größe möchten Sie Displays und Ansichten anzuzeigen. Dann fügen Sie in Ihre Modenform. Dieses Muster wiederholt sich an die Kante der Box Ansicht (sichtbaren Bereich) | id = "eindeutige ID verwendet, um dieses Muster zu verweisen." erforderlich. patternUnits = "userSpaceOnUse" oder "objectBoundingBox". Der zweite Wert X, Y, Breite, Höhe Frame-Modus einen kleinen Teil des Objekts, wobei die Einheit (%) verwenden. " patternContentUnits = " 'userSpaceOnUse' oder 'objectBoundingBox'" patternTransform = "ermöglicht es dem gesamten Ausdruck zu konvertieren" x = "Offset-Modus, von der oberen linken Ecke (Standard: 0) gewonnen." y = "Offset-Modus, von der oberen linken Ecke (Standard: 0) gewonnen." width = "Musterfliese Breite (Standard ist 100%)." height = "Musterfliese Höhe (Standard: 100%)." viewBox = "Punkte" gesehen "diese SVG-Zeichenfläche. 4 durch Leerzeichen getrennte Werte oder Komma. (min x, y min, Breite, Höhe)" xlink: href = "Ein weiteres Modell ist der Wert der Eigenschaft der Standard und jede Unterklasse Rekursion erben kann." |
| <Polygon> | Definiert eine Zeichnung enthält mindestens drei Seiten | Punkte = "Punkt des Polygons. Die Gesamtzahl der Punkte muss auch sein." Erforderlich. Fill-Regel = "Abschnitt fillstroke Präsentation Attribut" + Anzeigen Eigenschaften: Farbe, fillstroke, Grafik, Marker |
| <Linienzug> | Definieren Sie eine beliebige Form nur gerade Linien | Polylinienpunkte = "Punkt." Erforderlich. + Anzeigen Eigenschaften: Farbe, fillstroke, Grafik, Marker |
| <RadialGradient> | Definition von radioaktiven allmählich. Erstellen Sie einen radialen Verlauf Kreis | gradientUnits = " 'userSpaceOnUse" oder "objectBoundingBox". Verwenden Sie das Ansichtsfeld oder das Objekt die relative Position von Vektorpunkten zu bestimmen. (Der Standardwert ist' objectBoundingBox) " gradientTransform = "gilt Steigungen zu transformieren" cx = "Mittelpunkt des Gradienten (Zahlen oder% - 50% ist die Standardeinstellung)." cy = "Mittelpunkt des Gradienten. (Standard 50%)." r = "gradual Radius. (Standard 50%)." fx = "Brennpunkt des Gradienten. (default 0%)" fy = "Brennpunkt des Gradienten. (default 0%)" spread = "" Pad "oder" spiegeln "oder" Repeat "" xlink: href = "Verweis auf eine andere Steigung, deren Eigenschaftswert als Standard-Rekursion." |
| <Rect> | Definieren Sie ein Rechteck | x = "x-Achse linken oberen Ecke des Rechtecks." y = "y-Achse der oberen linken Ecke des Rechtecks." rx = "Radius (Round Element) x-Achse." ry = "Radius der y-Achse (Round-Element)" width = "Breite des Rechtecks." Erforderlich. height = "Höhe des Rechtecks." Erforderlich. + Anzeigen Eigenschaften: Farbe, fillstroke, Graphiken |
| Skript | Script-Container. (Wie ECMAScript) | |
| Set | Festlegen eines Eigenschaftswert für die angegebene Zeit | |
| <Stop> | Gradient Anschlag | offset = "Stop Offset (0-1 / 0% bis 100%)." Referenz Stopp-color = "color dieser Anschlag" Stop-Opazität = "Stoppen Sie die Undurchsichtigkeit des (0-1)." |
| Stil | Stylesheets können direkt im SVG-Inhalt eingebettet werden | |
| <Svg> | Erstellen Sie ein SVG-Dokumentfragment | x = "in der oberen linken Ecke eingebettet (Standard: 0)." y = "in der oberen linken Ecke eingebettet (Standard: 0)." width = "Breite SVG-Fragment (der Standard ist 100%)." height = "Höhe SVG-Fragment (der Standard ist 100%)." viewBox = "Punkte" gesehen "in dieser SVG Zeichenbereich. 4 durch Leerzeichen oder Komma getrennte Werte. (min x, y min, Breite, Höhe)" preserveAspectRatio = "" keine "oder jede" xVALYVAL 'neun Kombinationen, VAL ist "min", "Mitte" oder "max". (default keine) " zoomAndPan = "" mundo "oder" disable'.Magnify Option ermöglicht es Benutzern, Dateien (Standard Magnify) zu schwenken und zoomen " xml = "äußerste <svg> Element und seine Notwendigkeit SVG-Namensraum zu installieren: xmlns =" http://www.w3.org/2000/svg "xmlns: xlink =" http: //www.w3. org / 1999 / xlink "xml: space =" preserve "" + Anzeigen Eigenschaften: alle |
| Schalter | ||
| Symbol | ||
| <Text> | Definieren Sie einen Text | x = "Liste der X - .. Die Position der Welle in dem Text an der Position der ersten n Zeichen der n-ten x-Achse, wenn es zusätzliche Zeichen hinter sind, erschöpft sie nach dem letzten Zeichenposition 0 gesetzt ist der Standard." y = "Y-Achsen-Position in der Liste. (siehe x) 0 ist die Standardeinstellung." dx = "relative gezogen letzte Glyphe in der Länge der Liste der Zeichen in der absoluten Position (siehe x) bewegen" dy = "relative gezogen letzte Glyphe in der Länge der Liste der Zeichen in der absoluten Position (siehe x) bewegen" drehen = "eine rotierende Liste der n-ten Drehung der ersten n Zeichen. zusätzliche Zeichen hat keinen Endschleuderdrehzahl Wert geben" textLength = "SVG Viewer wird versuchen, den Abstand zwischen dem Text / Schriftart zu zeigen, oder die Länge des Zieltextes (Standard: normale Länge des Textes) einzustellen." lengthAdjust = "erzählt dem Betrachter, wenn Sie versuchen, die Länge angeben, angepasst, um den Text zu machen. Diese beiden Werte sind" Abstand "und" spacingAndGlyphs ' " + Anzeigen Eigenschaften: Farbe, fillstroke, Grafik, FontSpecification, TextContentElements |
| textPath | ||
| Titel | Reine Elemente in SVG Textbeschreibung - nicht als Teil der Grafik angezeigt werden soll. Benutzerprogramme können als Tooltip angezeigt werden | |
| <Tref> | Wenden Sie sich an jedem SVG-Dokument <text> -Element und Wiederverwendung | Same <TEXT> -Element |
| <Tspan> | Element äquivalent zu dem <Text>, aber es kann sich im Text verschachtelt werden und die interne Markierung | Identisch mit dem <text> -Element + Darüber hinaus: xlink: href = "Verweis auf eine <TEXT> Element" |
| <Verwenden> | URI-Referenz ein <G>, <svg> oder eine andere Eigenschaft verwendet, hat eine eindeutige ID und wiederholt grafische Elemente. Kopieren des ursprünglichen Elements, so dass das Vorhandensein der ursprünglichen Datei ist nur eine Referenz. Ursprüngliche beeinflussen jede Änderung in allen Kopien. | x = "obere linke Element der x-Achsen-clone" y = "oben links y-Achse Element Klon" width = "Elementbreite klonen" height = "Höhe klonen Element" xlink: href = "URI Referenzen Klonen Element" + Anzeigen Eigenschaften: alle |
| Ansicht | ||
| vkern |