English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
manuale di riferimento SVG raccoglie gli elementi comuni di SVG, i metodi di utilizzo degli attributi degli elementi, nonché i parametri di utilizzo dettagliati, le descrizioni descrittive ecc.
elemento | descrizione | proprietà |
---|---|---|
<a> | creare un elemento SVG attorno al collegamento | xlink:show xlink:actuate xlink:href target |
<altGlyph> | permettere all'oggetto di testo di controllare, per presentare dati di caratteri speciali | x y dx dy rotate glyphRef format xlink:href |
<altGlyphDef> | definire una serie di sostituzioni di simboli di natura | id |
<altGlyphItem> | definire una serie di sostituzioni di simboli di natura | id |
<animate> | cambiamento dinamico delle proprietà nel tempo | attributeName="nome dell'attributo di destinazione" from="起始值" to="结束值" dur="durata" repeatCount="quando si ripeterà l'animazione" |
<animateColor> | definire la trasformazione del colore nel tempo | by="相对偏移值" from="起始值" to="结束值" |
<animateMotion> | movimento dell'elemento lungo il percorso dell'azione | calcMode="modalità di interpolazione dell'animazione. Può essere 'discreta',
"lineare", "ritmato", "spline" path="percorso di movimento" keyPoints="la distanza che l'oggetto deve muoversi lungo il percorso di movimento al tempo corrente" rotate="applica la trasformazione di rotazione" xlink:href="un URI che riferisce all'elemento <path> che definisce il percorso di movimento" |
<animateTransform> | Un elemento di destinazione dell'animazione cambia le proprietà, il che consente di controllare lo spostamento, lo zoom, la rotazione o l'inclinazione dell'animazione | by="相对偏移值" from="起始值" to="结束值" type="类型的转换其值是随时间变化。可以是 'translate', 'scale', 'rotate', 'skewX', 'skewY'" |
<circle> | 定义一个圆 | cx="圆的x轴坐标" cy="圆的y轴坐标" r="圆的半径". 必需. + 显现属性:颜色,FillStroke,图形 |
<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> | Descrizione del testo puro dell'elemento SVG - non viene visualizzato come parte del grafico. L'agente utente lo visualizzerà come tooltip | |
<ellipse> | 定义一个椭圆 | cx="椭圆x轴坐标" cy="椭圆y轴坐标" rx="沿x轴椭圆形的半径"。必需。 ry="沿y轴长椭圆形的半径"。必需。 + 显现属性:颜色,FillStroke,图形 |
<feBlend> | 使用不同的混合模式将两个对象合并在一起 | mode="图像混合模式:normal|multiply|screen|darken|lighten" in="标识为给定的滤镜原始输入:SourceGraphic | SourceAlpha | BackgroundImage | BackgroundAlpha | FillPaint | StrokePaint | <filter-primitive-reference>" in2="operazione di mescolamento dell'immagine di input secondario" |
feColorMatrix | Filtro SVG. Applica una trasformazione matriciale | |
feComponentTransfer | Filtro SVG. Esegui una rimappatura component-wise dei dati | |
feComposite | Filtro SVG | |
feConvolveMatrix | Filtro SVG | |
feDiffuseLighting | Filtro SVG | |
feDisplacementMap | Filtro SVG | |
feDistantLight | Filtro SVG. Definizione di una sorgente di luce | |
feFlood | Filtro SVG | |
feFuncA | Filtro SVG. Elemento figlio di feComponentTransfer | |
feFuncB | Filtro SVG. Elemento figlio di feComponentTransfer | |
feFuncG | Filtro SVG. Elemento figlio di feComponentTransfer | |
feFuncR | Filtro SVG. Elemento figlio di feComponentTransfer | |
feGaussianBlur | Filtro SVG. Esegui un'effusione gaussiana sull'immagine | |
feImage | Filtro SVG. | |
feMerge | Filtro SVG. Costruito sugli strati di immagini sovrapposti | |
feMergeNode | Filtro SVG. Elemento figlio di feMerge | |
feMorphology | Filtro SVG. Esegui "fattening" o "thinning" sul grafico di origine | |
feOffset | Filtro SVG. Sposta l'immagine rispetto alla sua posizione corrente | |
fePointLight | Filtro SVG | |
feSpecularLighting | Filtro SVG | |
feSpotLight | Filtro SVG | |
feTile | Filtro SVG | |
feTurbulence | Filtro SVG | |
filter | Contenitore per l'effetto di filtro | |
font | Definizione del tipo di carattere | |
font-face | Descrizione delle caratteristiche di un tipo di carattere | |
font-face-format | ||
font-face-name | ||
font-face-src | ||
font-face-uri | ||
foreignObject | ||
<g> | Elemento contenitore utilizzato per combinare elementi correlati | id="nome del gruppo" fill="colore di riempimento del gruppo" opacity="opacità del gruppo" + Proprietà di visibilità: All |
glyph | Definizione del grafico per il simbolo pittografico specificato | |
glyphRef | Definizione dei simboli pittografici possibili da utilizzare | |
hkern | ||
<image> | Definizione dell'immagine | x="coordinata x dell'angolo superiore sinistro dell'immagine" y="coordinata y dell'angolo superiore sinistro dell'immagine" width="larghezza dell'immagine". Obbligatorio. height="altezza dell'immagine". Obbligatorio. xlink:href="path dell'immagine". Obbligatorio. + Proprietà di visibilità: Colori, Grafica, Immagini, Viste |
<line> | Definire una linea | x1="coordinata x dell'inizio della linea" y1="coordinata y dell'inizio della linea" x2="coordinata x della fine della linea" y2="coordinata y della fine della linea" + Proprietà di visibilità: Colore, riempimento tracciamento, Grafica, Marcatori |
<linearGradient> | Definire un degradato lineare. Utilizzando il riempimento del degradato vettoriale lineare dell'oggetto, può essere definito come degradato orizzontale, verticale o angolare. | id="id l'attributo può definire un nome unico per il degradato. L'uso deve essere" gradientUnits="'userSpaceOnUse' o 'objectBoundingBox'. Usa la cornice di vista o l'oggetto per determinare i punti vettoriali di posizione relativi. (predefinito 'objectBoundingBox')" gradientTransform="trasformazione applicabile al degradato" x1="punto di partenza della direzione x del degradato (predefinito 0%)" y1="punto di partenza della direzione y del degradato (predefinito 0%)" x2="punto di arrivo della direzione x del degradato. (predefinito 100%)" y2="punto di arrivo della direzione y del degradato. (predefinito 0%)" spreadMethod="'pad' or 'reflect' or 'repeat'" xlink:href="riferimento a un altro degradato il cui valori degli attributi vengono utilizzati come include defaults and stops. Recursive |
<marker> | Il marcatore può essere messo nei vertici di linee, curve, poligoni e percorsi. Questi elementi possono utilizzare le proprietà "marker-start", "marker-mid" e "marker-end" dell'attributo marker, che possono essere ereditati di default o impostati su "none" o l'URI del marcatore definito. È necessario definire il marcatore prima di poterlo referenziare tramite il suo URI. Qualsiasi forma può avere il marcatore all'interno. Li mettono in alto quando disegnano gli elementi | markerUnits="strokeWidth' o 'userSpaceOnUse'. Se è "strokeWidth", utilizza un'unità uguale alla larghezza di una traccia. Altrimenti, la scala del marcatore non utilizzerà la stessa unità di vista come elemento di riferimento (predefinito 'strokeWidth')" refx="posizione di connessione del vertice del marcatore (predefinito 0)" refy="posizione di connessione del vertice del marcatore (predefinito 0)" orient="'auto' mostra sempre l'angolo del marcatore. "auto" calcola un angolo tale che il tangente di un vertice dell'asse X (predefinito 0) markerWidth="larghezza del marcatore (predefinito 3)" markerHeight="l'altezza del marcatore (predefinito 3)" vedere "area di disegno SVG" da "ogni punto". Quattro valori separati da spazi o virgole (min x, min y, larghezza, altezza)" + attributi di presentazione: All |
<mask> | La maschera di protezione è una combinazione di valori di opacità e tagliatura. Come la tagliatura, puoi utilizzare grafica, testo o percorso per definire la parte della maschera. Lo stato predefinito di una maschera è completamente trasparente, ossia opposto alla superficie di tagliatura. Nella configurazione grafica della maschera, imposta la parte opaca della maschera | maskUnits="'userSpaceOnUse' or 'objectBoundingBox'. Determina se la maschera di tagliatura è relativa a una finestra completa o a un oggetto (predefinito: 'objectBoundingBox')" maskContentUnits="l'uso del secondo maschera relativa alla posizione grafica dell'oggetto in percentuale'userSpaceOnUse'o'objectBoundingBox'(predefinito: 'userSpaceOnUse')" x="maschera di tagliatura (valore predefinito: -10%)" y="maschera di tagliatura (valore predefinito: -10%)" larghezza="maschera di tagliatura (predefinito: 120%)" altezza="maschera di tagliatura (predefinito: 120%)" |
metadata | Specificare i metadati | |
missing-glyph | ||
mpath | ||
<path> | Definisci un percorso | d="definisci istruzioni di percorso" pathLength="se presente, l'oggetto percorso viene ridotto per calcolare la lunghezza del percorso equivalente a questo valore" transform="elenco di trasformazioni" + Proprietà di visibilità: Colore, riempimento tracciamento, Grafica, Marcatori |
<pattern> | Definisci le coordinate, la vista desiderata e la dimensione della vista. Poi aggiungili alla tua forma modello. Quando il modello colpisce, la vista si ripete ai margini della cornice della vista (visibile) | id="ID unico utilizzato per riferirsi a questo modello. Obbligatorio." patternUnits="userSpaceOnUse' o 'objectBoundingBox". Il secondo valore X, Y, larghezza, altezza utilizza una piccola parte del perimetro dell'oggetto modello, unità (%)" patternContentUnits="'userSpaceOnUse' o 'objectBoundingBox'" patternTransform="permette la trasformazione dell'intera espressione" x="offset del modello, partendo dall'angolo in alto a sinistra (predefinito 0)" y="offset del modello, partendo dall'angolo in alto a sinistra (predefinito 0)" larghezza="larghezza della tassellazione del modello (predefinito 100%)" altezza="altezza della tassellazione del modello (predefinito 100%)" vedere "area di disegno SVG" da "ogni punto". Quattro valori separati da spazi o virgole (min x, min y, larghezza, altezza)" xlink:href="Un altro schema, i valori degli attributi come valore predefinito e qualsiasi sottoclasse può ereditare. Ricorsivo" |
<polygon> | Definire un grafico con almeno tre lati | points="Punti del poligono. Il numero di punti deve essere dispari". Obbligatorio. fill-rule="Proprietà dimostrativa di FillStroke" + Proprietà di visibilità: Colore, riempimento tracciamento, Grafica, Marcatori |
<polyline> | Definire una forma composta solo da linee | points="Punti sulla linea. Obbligatorio. + Proprietà di visibilità: Colore, riempimento tracciamento, Grafica, Marcatori |
<radialGradient> | Definire una progressione radiante. La progressione radiante crea un cerchio | gradientUnits="'userSpaceOnUse' or 'objectBoundingBox'. Usa la casella di visualizzazione o l'oggetto per determinare i punti vettoriali di posizione relativi. (predefinito 'objectBoundingBox')" gradientTransform="Trasformazione applicata alla progressione" cx="Punto centrale (numero o % - 50% è predefinito) cy="Punto centrale della progressione. (predefinito 50%) r="Raggio della progressione. (predefinito 50%) fx="Punto di foco della progressione. (predefinito 0%) fy="Punto di foco della progressione. (predefinito 0%) spreadMethod="'pad' or 'reflect' or 'repeat'" xlink:href="Riferimento a un'altra progressione, i valori degli attributi come valore predefinito. Ricorsivo" |
<rect> | Definire un rettangolo | x="Asse x dell'angolo in alto a sinistra del rettangolo" y="Asse y dell'angolo in alto a sinistra del rettangolo" rx="Raggio dell'asse x (elemento rotondo") ry="Raggio dell'asse y (elemento rotondo") width="Larghezza del rettangolo". Obbligatorio. height="Altezza del rettangolo". Obbligatorio. + Proprietà di visibilità: Colore, riempimento tracciamento, Grafica |
script | Contenitore script (ad esempio ECMAScript) | |
set | Impostare un valore di attributo specifico per il tempo | |
<stop> | Stop della progressione | offset="Offset della stop (da 0 a 1/da 0% a 100%). Riferimento stop-color="Colore di questo stop" stop-opacity="Opacità di questo Stop (da 0 a 1) |
style | Permette di incorporare direttamente uno stile in un contenuto SVG | |
<svg> | Creare un segmento di documento SVG | x="Inserimento in alto a sinistra (predefinito a 0") y="Inserimento in alto a sinistra (predefinito a 0") width="Larghezza del segmento SVG (predefinito al 100%") height="Altezza del segmento SVG (predefinito al 100%)" viewBox="Punto 'seen' della regione di disegno SVG. Quattro valori separati da spazi o virgole. (min x, min y, larghezza, altezza)" preserveAspectRatio="'none' o qualsiasi combinazione delle 9 'xVALYVAL', VAL è 'min', 'mid' o 'max'. (Predefinito: none)" zoomAndPan="'magnify' o 'disable'. L'opzione Magnify permette agli utenti di spostarsi e zoomare il tuo file (predefinito Magnify )" xml="Tutti gli elementi esterni <svg> devono avere SVG e il suo spazio dei nomi: xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"" + Proprietà di visibilità: All |
switch | ||
symbol | ||
<text> | Definire un testo | x="Posizione sull'asse X dell'elenco. Nella testo, la posizione del n-esimo carattere è nel n-esimo punto dell'asse X. Se ci sono caratteri aggiuntivi, vengono posizionati dopo l'ultimo carattere. 0 è il valore predefinito" y="Posizione sull'asse Y dell'elenco. 0 è il valore predefinito" dx="Posizione assoluta relativamente all'ultimo simbolo disegnato nel elenco di lunghezze dei caratteri. (Riferimento a x)" dy="Posizione assoluta relativamente all'ultimo simbolo disegnato nel elenco di lunghezze dei caratteri. (Riferimento a x)" rotate="Elenco di rotazioni. La rotazione del n-esimo è il n-esimo carattere. I caratteri aggiuntivi non forniscono il valore di rotazione finale" textLength="Il visualizzatore SVG tenterà di visualizzare la lunghezza tra i testi / o la lunghezza del testo target dell'adattamento dei glifi. (Predefinito: lunghezza del testo normale)" lengthAdjust="Informare il visualizzatore di cercare di adattare la lunghezza specificata per visualizzare il testo. Questi valori sono 'spacing' e 'spacingAndGlyphs'" + Proprietà di visibilità: Colore, Riempimento e Traccia, Grafica, Specifica del Font, Elementi di Contenuto del Testo |
textPath | ||
title | Descrizione del testo puro dell'elemento SVG - non viene visualizzato come parte del grafico. L'agente utente lo visualizzerà come tooltip | |
<tref> | Riferimento a qualsiasi elemento <text> del documento SVG e riutilizzo | L'elemento <TEXT> identico |
<tspan> | L'elemento è equivalente a <text>, ma può includere tag di testo all'interno e all'interno stesso | Identico all'elemento <text> + In aggiunta: xlink:href="Riferimento a un elemento <TEXT>" |
<use> | Utilizzare un URI per referenziare un <G>, <svg> o qualsiasi altro elemento con un attributo ID unico e elementi grafici ripetuti. La copia è l'elemento originale, quindi l'esistenza originale nel file è solo una riferimento. Le modifiche originali influenzano tutte le copie. | x="Ordinata dell'angolo superiore sinistro dell'elemento clonato" y="Ascissa dell'angolo superiore sinistro dell'elemento clonato" width="Larghezza dell'elemento clonato" height="Altezza dell'elemento clonato" xlink:href="URI di riferimento per clonare l'elemento" + Proprietà di visibilità: All |
view | ||
vkern |