带有SVG的PHP file_get_content

时间:2015-07-28 12:34:19

标签: php html css svg icons

我想在我的页面中包含一个.svg,感谢PHP(我已经在插画家CC上创建了这些SVG)

所以我使用这段代码:

<?php echo file_get_contents("ICON.svg"); ?>

不幸的是,有一个问题。生成页面时,我的图标上会出现两个符号:

  

] GT;

你可以看到here

请你帮我解决一下吗?

3 个答案:

答案 0 :(得分:1)

正如您在代码中看到的那样

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
<!ENTITY ns_flows "http://ns.adobe.com/Flows/1.0/">
<!ENTITY ns_extend "http://ns.adobe.com/Extensibility/1.0/">
<!ENTITY ns_ai "http://ns.adobe.com/AdobeIllustrator/10.0/">
<!ENTITY ns_graphs "http://ns.adobe.com/Graphs/1.0/">
<!ENTITY ns_vars "http://ns.adobe.com/Variables/1.0/">
<!ENTITY ns_imrep "http://ns.adobe.com/ImageReplacement/1.0/">
<!ENTITY ns_sfw "http://ns.adobe.com/SaveForWeb/1.0/">
<!ENTITY ns_custom "http://ns.adobe.com/GenericCustomNamespace/1.0/">
<!ENTITY ns_adobe_xpath "http://ns.adobe.com/XPath/1.0/">
]>

你应该可以删除这个符号 如果这没有解决您的问题,请尝试删除[],我认为您不需要它们。

答案 1 :(得分:1)

如果你看一下你会看到的页面来源:

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
    <!ENTITY ns_flows "http://ns.adobe.com/Flows/1.0/">
    <!ENTITY ns_extend "http://ns.adobe.com/Extensibility/1.0/">
    <!ENTITY ns_ai "http://ns.adobe.com/AdobeIllustrator/10.0/">
    <!ENTITY ns_graphs "http://ns.adobe.com/Graphs/1.0/">
    <!ENTITY ns_vars "http://ns.adobe.com/Variables/1.0/">
    <!ENTITY ns_imrep "http://ns.adobe.com/ImageReplacement/1.0/">
    <!ENTITY ns_sfw "http://ns.adobe.com/SaveForWeb/1.0/">
    <!ENTITY ns_custom "http://ns.adobe.com/GenericCustomNamespace/1.0/">
    <!ENTITY ns_adobe_xpath "http://ns.adobe.com/XPath/1.0/">
]>

最后一行中的符号是你看到的那个,摆脱这个可怕的doctype声明,用有意义的东西替换它,问题就解决了......

顺便说一下。您不需要生成所有垃圾,只需将此部分插入HTML文档中即可:

       <svg version="1.1" id="Calque_1" xmlns:x="&ns_extend;" xmlns:i="&ns_ai;" xmlns:graph="&ns_graphs;"
     xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
     x="0px" y="0px" viewBox="0 0 316 316" enable-background="new 0 0 316 316" xml:space="preserve">
 <g>
        <path fill="#55BFD7" d="M158,0C70.7,0,0,70.7,0,158s70.7,158,158,158s158-70.7,158-158S245.3,0,158,0z M158,283
            c-69,0-125-56-125-125S89,33,158,33s125,56,125,125S227,283,158,283z"/>
    </g>
    <g>
        <path fill="#55BFD7" d="M125.2,88.8c-0.8,1.5-3.1,4.2-6.7,6.9c-10.3,7.6-20.3,5-26.5-3.4c-7.5-10.2-4.4-21.1,4.6-27.8
            c3.5-2.6,6.7-3.8,8.3-4.1l2.6,6.4c-1.8,0.4-4.1,1.3-6.5,3c-5.3,3.9-7.1,10.2-2.3,16.8c4.4,6,10.7,7.1,16.7,2.7c2-1.5,4-3.6,4.9-5.1
            L125.2,88.8z"/>
        <path fill="#55BFD7" d="M155,63.4c2.6,11.8-2.9,20.6-13.5,23c-10.7,2.4-18.8-4.3-21.1-14.6c-2.4-10.8,2.7-20.4,13.3-22.8
            C144.9,46.5,152.8,53.4,155,63.4z M129.1,69.7c1.6,7.1,6,11.3,11.5,10.1c5.5-1.2,7.5-7.2,5.9-14.2c-1.4-6.5-5.8-11.3-11.4-10.1
            C129.5,56.7,127.5,62.7,129.1,69.7z"/>
        <path fill="#55BFD7" d="M177.8,48.5l-5,20.7c-1.5,6.2,0.1,9.9,4.2,10.9c4.3,1,7.3-1.4,8.9-7.7l5-20.7l8.1,2l-4.9,20.1
            c-2.7,11.1-9.6,15-19,12.7c-9.1-2.2-13.2-8.5-10.4-20l4.9-20L177.8,48.5z"/>
        <path fill="#55BFD7" d="M215.6,62.8c2.3,1.2,5.4,3.2,9.4,6.3c4.1,3.1,6.4,6.2,7.1,9.2c0.7,2.9,0.1,6.3-2.1,9.2
            c-2.2,2.9-5,4.6-8,4.9c-3.9,0.4-8-1.2-11.9-4.2c-0.9-0.7-1.6-1.3-2.2-1.9L200,96.7l-6.6-5L215.6,62.8z M212,81.1
            c0.5,0.6,1.1,1.1,2.1,1.9c3.5,2.7,7.1,2.6,9.4-0.4c2.1-2.7,1.4-5.7-1.9-8.3c-1.3-1-2.4-1.6-2.9-1.8L212,81.1z"/>
    </g>
    <g>
        <path fill="#55BFD7" d="M99.5,252.4c-1.7-0.4-4.9-1.9-8.3-4.8c-9.9-8.1-9.9-18.4-3.3-26.5c8-9.8,19.4-9.5,28-2.4
            c3.4,2.7,5.3,5.5,6,7l-5.5,4.1c-0.9-1.6-2.3-3.6-4.6-5.5c-5.1-4.2-11.7-4.4-16.9,2c-4.7,5.7-4.2,12.1,1.5,16.8
            c2,1.6,4.5,2.9,6.2,3.5L99.5,252.4z"/>
        <path fill="#55BFD7" d="M156.3,271.6l-20.3-4.6c-1-0.2-2.1-0.3-3.4-0.4c-1.3-0.2-2.7-0.3-4.4-0.7c-12.4-2.8-16.1-12.7-13.9-22.4
            c2.6-11.5,11.6-17.3,22.5-14.8c2,0.4,3.5,1,4.8,1.4c1.3,0.5,2.4,0.9,3.3,1.1l18.9,4.3l-1.5,6.7l-14.1-3.2l-1.7,7.5l13.3,3l-1.5,6.6
            l-13.3-3l-1.9,8.6l14.8,3.4L156.3,271.6z M140,237c-0.9-0.7-2.3-1.3-4.1-1.7c-5.6-1.3-11.3,1.9-13.1,9.8c-1.7,7.1,1.2,13,8.1,14.6
            c1.3,0.3,2.8,0.4,3.8,0.2L140,237z"/>
        <path fill="#55BFD7" d="M172.3,231.1l5.9,20.4c1.8,6.1,5,8.5,9.1,7.3c4.2-1.2,5.7-4.8,3.9-11.1l-5.9-20.4l8-2.3l5.8,19.9
            c3.2,11-0.8,17.8-10.1,20.5c-8.9,2.6-15.7-0.8-18.9-12.1l-5.7-19.8L172.3,231.1z"/>
        <path fill="#55BFD7" d="M195.3,223.9c1.8-2,4.7-4.8,8.1-7.6c4.2-3.5,7.7-5.3,11.1-5.3c2.8,0,5.4,1.2,7.5,3.8
            c3,3.7,2.4,8.3,0.7,11.2l0.1,0.1c2.7-0.8,5.3,0.2,8.2,2.2c3.5,2.5,7.5,5.5,8.9,6.2l-6.6,5.4c-1.1-0.4-3.7-2.2-7.4-5
            c-3.7-2.9-5.7-2.9-8.4-0.8l-2,1.6l9.2,11.3l-6.4,5.2L195.3,223.9z M211.8,231l2.5-2.1c3.2-2.6,3.8-5.8,1.8-8.3
            c-2.1-2.6-5-2.5-8-0.1c-1.6,1.3-2.4,2.1-2.8,2.6L211.8,231z"/>
    </g>
    <g>
        <path fill="#55BFD7" d="M140.1,146.1c-1.8,0-2.9,0.2-3.6,0.3v23.2c0.7,0.2,1.8,0.2,2.8,0.2c7.2,0.1,12-3.9,12-12.4
            C151.3,150,147,146.1,140.1,146.1z"/>
        <path fill="#55BFD7" d="M205,122c-13-13-34-13-47,0c-13-13-34-13-47,0s-13,34,0,47l47,47l47-47C218,156.1,218,135,205,122z
             M153.9,171.4c-3.7,3.1-9.4,4.6-16.3,4.6c-4.1,0-7.1-0.3-9.1-0.5v-34.8c2.9-0.5,6.8-0.7,10.8-0.7c6.7,0,11.1,1.2,14.5,3.8
            c3.7,2.7,6,7.1,6,13.3C159.7,163.9,157.3,168.6,153.9,171.4z M187.6,175.6H165v-35.4h21.8v6.6H173v7.4h13v6.5h-13v8.4h14.5V175.6z"
            />
    </g>
    <ellipse fill="#55BFD7" cx="-265" cy="29" rx="106" ry="0"/>
    </svg>

答案 2 :(得分:-1)

对应于您的源代码,错误不是来自svg本身,而是来自包装它的代码。

!DOCTYPE svg PUBLIC&#34; - // W3C // DTD SVG 1.1 // EN&#34;
... ]&GT;