演示效果：http://www.zuoan.com.cn/static/d.html

弟一步：PS中導(dǎo)入LOGO，選擇載入選區(qū)。

第二步：在選區(qū)里點(diǎn)鼠標(biāo)右鍵，建立工作路徑

第三步：將圖層隱藏后導(dǎo)出路徑到AI

第四步：導(dǎo)入到AI中。我們發(fā)現(xiàn)它是白色的，看不見。選擇一下看到了路徑線條，先去掉背景框。

第五步：選擇描邊框，選擇顏色，再回去看，路徑就有顏色了。

第六步：選擇路徑，選擇導(dǎo)出SVG

要說明的是有的文字比如說O這種，它會有兩個路徑，外圈和內(nèi)圈，那么需要在導(dǎo)出之前設(shè)置一下路徑模式。

導(dǎo)出之后我們就得到了一個SVG文件了。 可以在編輯器中打開看到其SVG代碼路徑。

醉后合成代碼。

    
    
      
    
        html,body{background: #000;}
        svg{
          width:100%;height:200px;
          margin-top: 20%;
         
        }

        .st0{fill: none;            
        stroke-width:2;            
        stroke:#fff;            
        stroke-dasharray: 250;            
        animation: lineMove 10s ease-out infinite;                 
        }
        svg g{ margin-left: -100px;  }
        @keyframes lineMove {
            0%{                
            stroke-dasharray: 0, 250;            
            }
            100%{                
            stroke-dasharray: 250, 250;            
            }
        }