显示svg部分的问题

Question

我正在处理一些混乱的SVG代码，在产品页面上显示图标有问题。

图标应该是这样的：

​

​

下面是如何用缺失的滴落(链接到产品页面)显示它：

​

​

我检查了浏览器中的代码，并尝试了不同的方法，比如将元素填充设置为特定的颜色等等。但是，即使在开发工具中，我也无法使用例如element.style{fill: red!important;}来设置开发工具中元素的颜色。我不明白，它是怎么被改写的。

如果有人能给我指明正确的方向，我将不胜感激。

​

​

Answer 1

只需要display:none;或删除/注释第二<g>在<g id="Illu">内。附带的截图会帮助你更多。

​

​

<g id="Illu"> :-的更新代码

 <g id="Illu">
      <g>
        <defs>
          <rect id="SVGID_1_" x="2.8" y="2.8" width="70.9" height="70.9"></rect>
        </defs>
        <clipPath id="SVGID_2_">
          <use xlink:href="#SVGID_1_" style="overflow:visible;"></use>
        </clipPath>
        <path class="st1" d="M38.3,72.7c19,0,34.4-15.4,34.4-34.4c0-19-15.4-34.4-34.4-34.4S3.8,19.3,3.8,38.3
                        C3.8,57.3,19.3,72.7,38.3,72.7z"></path>
        <path class="st2" d="M19.3,37.3c3.6,0,6.6-2.9,6.6-6.6c0-3.6-5-9.5-6.6-13.9c-1.6,4.4-6.6,10.3-6.6,13.9
                        C12.8,34.3,15.7,37.3,19.3,37.3z"></path>
        <path class="st2" d="M33.7,43.6c2.6,0,4.7-2.1,4.7-4.7s-3.5-6.8-4.7-9.9c-1.1,3.1-4.7,7.3-4.7,9.9S31.2,43.6,33.7,43.6z"></path>
      </g>
    <!--  <g>
        <defs>
          <rect id="SVGID_3_" x="2.8" y="2.8" width="70.9" height="70.9"></rect>
        </defs>
        <clipPath id="SVGID_4_">
          <use xlink:href="#SVGID_3_" style="overflow:visible;"></use>
        </clipPath>
        <path class="st3" d="M38.3,72.7c19,0,34.4-15.4,34.4-34.4c0-19-15.4-34.4-34.4-34.4S3.8,19.3,3.8,38.3
                        C3.8,57.3,19.3,72.7,38.3,72.7z"></path>
      </g>-->
      <rect x="2.8" y="2.8" class="st4" width="70.9" height="70.9"></rect>
      <g>
        <path d="M12.5,61.1c0.6,0.7,1.3,1.4,1.9,2h47.7c0.7-0.6,1.3-1.3,1.9-2H12.5z"></path>
        <path d="M57.5,66.8c0.9-0.6,1.8-1.3,2.7-2H16.3c0.9,0.7,1.7,1.4,2.7,2H57.5z"></path>
        <path d="M57.7,23.3V35h2V23.3c-0.3,0-0.7,0.1-1,0.1S58.1,23.3,57.7,23.3z"></path>
        <path d="M46.3,9.5h-12v2h11.9c0-0.2,0-0.5,0-0.7C46.2,10.4,46.2,10,46.3,9.5z"></path>
        <path d="M49.1,18.8l-8.8,8.8l1.4,1.4l8.8-8.8C50,19.8,49.5,19.3,49.1,18.8z"></path>
        <path d="M58.7,21.4c-5.8,0-10.5-4.7-10.5-10.5c0-1.8,0.5-3.6,1.3-5.1c-0.6-0.2-1.3-0.4-1.9-0.6c-0.7,1.4-1.2,2.8-1.3,4.4
                        c0,0.4-0.1,0.9-0.1,1.3c0,0.2,0,0.5,0,0.7c0.2,2.7,1.2,5.3,2.8,7.3c0.4,0.5,0.9,1,1.4,1.4c2,1.7,4.5,2.9,7.3,3.1
                        c0.3,0,0.7,0.1,1,0.1s0.7,0,1-0.1c3-0.2,5.6-1.5,7.6-3.4c-0.4-0.6-0.7-1.1-1.1-1.7C64.3,20.1,61.7,21.4,58.7,21.4z"></path>
      </g>
      <line class="st5" x1="65.8" y1="58.3" x2="10.4" y2="58.3"></line>
    </g>