Propriedades curso SVG
Propriedades curso SVG
SVG oferece uma ampla gama de atributos de traçado. Neste capítulo, vamos olhar para o seguinte:
- golpe
- stroke-width
- stroke-linecap
- stroke-dasharray
Todos os atributos de acidente vascular cerebral pode ser aplicado a qualquer tipo de linhas, o texto e elementos como um contorno circular.
SVG propriedade acidente vascular cerebral
atributo de acidente vascular cerebral define uma linha ou cor elemento esboço do texto:
Aqui está o código SVG:
Exemplos
<G preencher = "none">
<Caminho AVC = d "vermelho" = "M5 20 L215 0" />
<Caminho AVC = "blue" d = "M5 40 L215 0" />
<Caminho AVC = "black" d = "M5 60 L215 0" />
</ G>
</ Svg>
tente »
Para os usuários do Opera: arquivo SVG vista (clique direito do mouse sobre o gráfico de origem pré-visualização SVG).
SVG stroke-width atributo
Tstroke- atributos largura definir uma linha, ou espessura elemento esboço do texto:
Aqui está o código SVG:
Exemplos
<G preenchimento = "none" stroke = "black">
<Caminho stroke-width = "2" d = "M5 20 L215 0" />
<Caminho stroke-width = "4" d = "M5 40 L215 0" />
<Caminho stroke-width = "6" d = "M5 60 L215 0" />
</ G>
</ Svg>
tente »
Para os usuários do Opera: arquivo SVG vista (clique direito do mouse sobre o gráfico de origem pré-visualização SVG).
SVG propriedade stroke-linecap
atributo strokelinecap define a extremidade de um caminho aberto de diferentes tipos:
Aqui está o código SVG:
Exemplos
<G preenchimento = "none" stroke = "black" stroke-width = "6">
<Caminho stroke-linecap = "bunda" d = "M5 20 L215 0" />
<Caminho stroke-linecap = "round" d = "M5 40 L215 0" />
<Caminho stroke-linecap = "quadrado" d = "M5 60 L215 0" />
</ G>
</ Svg>
tente »
Para os usuários do Opera: arquivo SVG vista (clique direito do mouse sobre o gráfico de origem pré-visualização SVG).
SVG propriedade stroke-dasharray
StrokeDashArray propriedade usada para criar a linha pontilhada:
Aqui está o código SVG:
Exemplos
<G preenchimento = "none" stroke = "black" stroke-width = "4">
<Caminho stroke-dasharray = "5,5" d = "M5 20 L215 0" />
<Caminho stroke-dasharray = "10,10" d = "M5 40 L215 0" />
<Caminho stroke-dasharray = "20,10,5,5,5,10" d = "M5 60 L215 0" />
</ G>
</ Svg>
tente »
Para os usuários do Opera: arquivo SVG vista (clique direito do mouse sobre o gráfico de origem pré-visualização SVG).