Css 如何在svg中间添加形状

Css 如何在svg中间添加形状,css,image,svg,Css,Image,Svg,我试图在圆圈中间添加一个护士形状。顶部有两个形状,我需要在圆圈中间放一个。有人能帮我吗。下面是一个svg: <?xml version="1.0" encoding="utf-8"?> <!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//E

我试图在圆圈中间添加一个护士形状。顶部有两个形状,我需要在圆圈中间放一个。有人能帮我吗。下面是一个svg:

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG    Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"  width="40px" height="40px" 
 viewBox="0 0 40 40" enable-background="new 0 0 40 40" xml:space="preserve">
<g>
<g>
    <path fill="#056991" d="M18.2,14.6c-0.2-0.6-0.5-1.2-0.9-1.7l0,0l-0.1,0l1.7-3C17.6,8.1,15.6,7,13.3,7C11,7,9,8.1,7.6,9.8
        c0.1,0.2,1.2,2.2,1.6,3l-0.1,0v0c-0.3,0.5-0.6,1.1-0.8,1.7c-0.2,0.6-0.8,2.8-0.8,3.5c0,0.6,0.2,1.3,0.7,1.7c0.4,0.4,1,0.7,1.7,0.7
        h0.6c0.8,0,1.8,0.9,2.8,0.9s2-0.9,2.8-0.9h0.6c0.7,0,1.3-0.3,1.7-0.7c0.4-0.4,0.6-1,0.6-1.6C19.1,17.4,18.4,15.2,18.2,14.6z
         M13.3,7.7c1.9,0,3.6,0.8,4.9,2.2l-1.3,2.5c-0.7-0.2-1.9-0.4-3.5-0.4c-1.6,0-2.8,0.2-3.5,0.4c-0.4-0.7-1-1.9-1.3-2.5
        C9.7,8.5,11.5,7.7,13.3,7.7z M13.3,19.9c-1.8,0-4.1-1.9-4.3-4.1c1-0.9,1.9-3.7,1.9-3.7c1.2,2,2.9,2.4,5,2.4c0.7,0,1.2,0.1,1.5-0.1
        c0.1,0.3,0.1,1,0.1,1.4C17.6,18.2,15.1,19.9,13.3,19.9z"/>
    <polygon fill="#056991" points="14.8,10.3 13.8,10.3 13.8,11.3 12.9,11.3 12.9,10.3 11.8,10.3 11.8,9.4 12.9,9.4 12.9,8.3 
        13.8,8.3 13.8,9.4 14.8,9.4      "/>
</g>
<g>
    <path fill="#056991" d="M31.7,14.6c-0.2-0.6-0.5-1.2-0.9-1.7l0,0l-0.1,0l1.7-3C31.1,8.1,29.1,7,26.8,7c-2.3,0-4.3,1.1-5.7,2.8
        c0.1,0.2,1.2,2.2,1.6,3l-0.1,0v0c-0.3,0.5-0.6,1.1-0.8,1.7C21.7,15.1,21,17.4,21,18c0,0.6,0.2,1.3,0.7,1.7c0.4,0.4,1,0.7,1.7,0.7
        H24c0.8,0,1.8,0.9,2.8,0.9s2-0.9,2.8-0.9h0.6c0.7,0,1.3-0.3,1.7-0.7c0.4-0.4,0.6-1,0.6-1.6C32.6,17.4,31.9,15.2,31.7,14.6z
         M26.8,7.7c1.9,0,3.6,0.8,4.9,2.2l-1.3,2.5c-0.7-0.2-1.9-0.4-3.5-0.4c-1.6,0-2.8,0.2-3.5,0.4c-0.4-0.7-1-1.9-1.3-2.5
        C23.2,8.5,25,7.7,26.8,7.7z M26.8,19.9c-1.8,0-4.1-1.9-4.3-4.1c1-0.9,1.9-3.7,1.9-3.7c1.2,2,2.9,2.4,5,2.4c0.7,0,1.2,0.1,1.5-0.1
        c0.1,0.3,0.1,1,0.1,1.4C31.1,18.2,28.6,19.9,26.8,19.9z"/>
    <polygon fill="#056991" points="28.3,10.3 27.3,10.3 27.3,11.3 26.4,11.3 26.4,10.3 25.3,10.3 25.3,9.4 26.4,9.4 26.4,8.3 
        27.3,8.3 27.3,9.4 28.3,9.4      "/>
</g>
 </g>
  <circle fill="none" stroke="#056991" stroke-width="2.08" stroke-miterlimit="10" cx="20" cy="19.8" r="18.8"/>



 </svg>

  • 下载inkscape

  • 打开它。
  • 编辑它。
  • 将其导出到svg。
  • 下面是一些提示,告诉您有关svg的更多信息:

    Youtube上有很多关于inkscape的指南。因此,在这种情况下: 1.首先搜索youtube
    2.谷歌
    3.应该使用inkscape搜索您的大多数问题,inkscape是一个易于使用的编辑器。


    注意:可能尝试保存一些svg图像并查看其内部外观(使用pspad或notepad++或任何文本编辑器)。

    为什么不使用诸如inkscape之类的svg编辑器来执行此操作?我尝试使用以下方法:。但这很难做到。