SVG实例

SVG元素

SVG各种类型的例子

 

Demo1:渐变文字

代码:



 
  
  
  
  
  
  Applying a gradient background to text in SVG
 
 
     
        
            
                
                
                
                
                
                
            
        
        S.QW.YA
    
 

 效果:

SVG实例_第1张图片

解释:

xmlns="http://www.w3.org/2000/svg"      是XML命名空间,在SVG标签中定义 。

version="1.1"      是SVG命名空间的版本。

viewBox     属性允许指定一个给定的一组图形伸展以适应特定的容器元素。

SVG实例_第2张图片

SVG实例_第3张图片

     引用的元素容器

SVG实例_第4张图片

SVG实例_第5张图片

 

demo2:折线



 
  
  
  
  
  
  My svg demo
 
 
        
            
        
 

 效果:

 SVG实例_第6张图片

 

你可能感兴趣的:(我的前端笔记)