SVG

SVG意为可伸缩矢量图形

# 基本样式应用

  # 定义路径 M路径开始 L路径到达 Z关闭路径
  

  # 创建折线 points="x1,y1 x2,y2 x3,y3...."
  

  # 定义不少于三个角的多边形 points="x1,y1 x2,x2 x3,y3..."
  

  # 定义线条 x1 X轴线条开始 y1 Y轴线条开始 x2 X轴线条结束 y2 Y轴线条结束
  

  # 定义椭圆 cx圆X坐标 cy圆Y坐标 rx水平半径 ry垂直半径
  

  # 定义圆 cx圆X坐标 cy圆Y坐标 r半径 fill填充色 stroke边框色 stroke-width边框宽
  

  # 定义矩形 宽|| 高 || 填充色 || 边框宽 || 线条色
  


# 线性渐变
 1. linearGradient定义线性渐变
 2. x1、x2、y1、y2 属性可定义渐变的开始和结束位置
 3. 渐变颜色由 stop标签来设定
 4. x1 x2 y1 y2值不同渐变也就不同

  
    
      
      
    
  
  


# 放射渐变
 1. radialGradient定义放射渐变 cx cy r 外层圆 || fx fy 内层圆
 2. stop标签用来设置颜色 offset属性定义渐变的开始和结束

  
    
      
      
    
  
  


#  定义滤镜
 1. defs标签必须包裹fliter标签
 2. fliter标签属性id用来指定那个图形应用该路径
 3. feGaussianBlur标签用来定义滤镜效果
 4. stdDeviation定义模糊程度
 5. in="SourceGraphic"由整个图像创建
 6. 给应用图像使用filter:url(#指定的id)属性

  
    
      
    
  
  


你可能感兴趣的:(SVG)