点击查看html编辑器说明文档

svg 镂空edit icon

|
|
Fork(复制)
|
|
作者:
lynn-ssk
提交反馈
嵌入
设置
下载
HTML
格式化
支持Emmet,输入 p 后按 Tab键试试吧!
<head> ...
展开
</head>
<body>
            
            <svg version="1.1"
     width="343" height="179"
     viewBox="0 0 343 179"
     xmlns="http://www.w3.org/2000/svg">
    <path d="
      M 0 0 
      H 343 
      V 47
      A 7 7, 0, 0, 0, 343 61
      V 179 
      H 0
      V 61
      A 7 7, 0, 0, 0, 0 47
      z"/>
</svg>

<svg id="svg2" width="320" height="320" xmlns="http://www.w3.org/2000/svg">
  <path d="M 10 315
           L 110 215
           A 30 50 0 0 1 162.55 162.45
           L 172.55 152.45
           A 30 50 -45 0 1 215.1 109.9
           L 315 10" stroke="black" fill="green" stroke-width="2" fill-opacity="0.5"/>
</svg>
        
</body>
CSS
格式化
            
            body {
  display: flex;
  justify-content: center;
  align-items: center;
}

svg{
  background: #eee;
}
        
JS
格式化
            
            
        
预览
控制台