2016-10-02 37 views
-1

ChromeとSafariでSVGのロゴが正しく表示されます。それはIllustratorで作られています(私ではなく、私はバージョンを知らない)。しかし、FFでそれは奇妙に見えています。理由を見つけることができません。私はフィルタを使用せず、ただSVGイメージです。私は気づいた、私は 'img'タグで実装すると、それはうまく見えますが、あまりにも小さくなります。ここでは、コードがあります:FirefoxでSVGが正しく表示されないのはなぜですか?

<span> 
 
<a href="#"> 
 
    <svg version="1.1" 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" width="190px" height="42px" viewBox="93.496 77.153 190 42" 
 
     overflow="visible" enable-background="new 93.496 77.153 190 42" xml:space="preserve"> 
 
    <defs></defs> 
 
    <g> 
 
     <defs> 
 
     <path class="logotype" id="SVGID_2_" d="M125.99,85.758c-0.725-0.005-1.443-0.016-2.154-0.034c0.072-1.776,0.818-3.368,2.002-4.549 
 
      c1.244-1.236,2.953-2,4.854-2c1.898,0,3.609,0.764,4.854,2c1.102,1.1,1.829,2.561,1.978,4.193 
 
      c-3.235,0.256-6.702,0.396-10.312,0.396C126.806,85.765,126.398,85.762,125.99,85.758 M124.41,79.744 
 
      c-1.531,1.522-2.508,3.611-2.596,5.918c-4.139-0.158-8.042-0.497-11.571-0.982l-1.538,7.253c5.02,0.72,10.882,1.135,17.144,1.135 
 
      c1.814,0,3.595-0.036,5.331-0.104l4.226,21.692c9.233,0.162,17.411,1.503,22.897,3.531l-6.656-35.073 
 
      c-3.283,0.903-7.416,1.617-12.107,2.078c-0.195-2.121-1.139-4.029-2.566-5.447c-1.605-1.602-3.832-2.591-6.281-2.591 
 
      S126.014,78.142,124.41,79.744"/> 
 
     </defs> 
 
     <clipPath id="SVGID_3_"> 
 
     <use xlink:href="#SVGID_2_" overflow="visible"/> 
 
     </clipPath> 
 
     <rect x="102.238" y="77.153" clip-path="url(#SVGID_3_)" fill="#C80711" width="59.287" height="52.211"/> 
 
     <path class="logotype" clip-path="url(#SVGID_3_)" fill="#E74200" d="M137.781,150.214l-13.065-12.074l-13.067,12.074l1.295-17.745l-17.588-2.688 
 
     l14.68-10.052l-8.865-15.427l17.012,5.211l6.534-16.55l6.534,16.55l17.013-5.211l-8.866,15.427l14.682,10.052l-17.59,2.688 
 
     L137.781,150.214z M124.716,133.246l8.821,8.153l-0.873-11.981l11.873-1.812l-9.912-6.787l5.986-10.414l-11.484,3.517 
 
     l-4.411-11.171l-4.411,11.171l-11.485-3.517l5.986,10.414l-9.911,6.787l11.873,1.812l-0.873,11.981L124.716,133.246z"/> 
 
     <path class="logotype" clip-path="url(#SVGID_3_)" fill="#E74200" d="M146.598,169.522l-21.882-20.223l-21.88,20.223l2.166-29.714l-29.449-4.5 
 
     l24.58-16.832L85.289,92.644l28.487,8.724l10.939-27.71l10.939,27.71l28.488-8.724l-14.846,25.832l24.583,16.832l-29.451,4.5 
 
     L146.598,169.522z M124.716,144.407l17.634,16.298l-1.746-23.947l23.736-3.627l-19.812-13.566l11.965-20.818l-22.958,7.032 
 
     l-8.818-22.334l-8.817,22.334L92.94,98.746l11.964,20.818L85.092,133.13l23.736,3.627l-1.746,23.947L124.716,144.407z"/> 
 
     <path class="logotype" clip-path="url(#SVGID_3_)" fill="#E74200" d="M94.051,188.764l3.037-41.644l-41.273-6.305l34.45-23.59L69.461,81.023 
 
     l39.923,12.227l15.332-38.834l15.333,38.834l39.924-12.225l-20.805,36.201l34.451,23.59l-41.275,6.305l3.037,41.644l-30.665-28.338 
 
     L94.051,188.764z M124.716,155.534l26.419,24.413l-2.615-35.878l35.559-5.431l-29.682-20.324l17.926-31.188L137.925,97.66 
 
     l-13.209-33.461L111.507,97.66L77.111,87.125l17.924,31.188l-29.681,20.324l35.558,5.431l-2.615,35.878L124.716,155.534z"/> 
 
     <path class="logotype" clip-path="url(#SVGID_3_)" fill="#E74200" d="M85.701,207.058l3.863-52.984l-52.515-8.022l43.834-30.014L54.411,69.977 
 
     l50.796,15.556l19.509-49.412l19.507,49.412l50.798-15.556l-26.472,46.061l43.833,30.014l-52.515,8.022l3.863,52.984 
 
     l-39.015-36.056L85.701,207.058z M124.716,166.11l34.771,32.131l-3.443-47.217l46.8-7.15l-39.064-26.748l23.59-41.046 
 
     l-45.268,13.863l-17.386-44.037L107.33,89.943L62.062,76.078l23.592,41.048l-39.063,26.748l46.799,7.15l-3.442,47.217 
 
     L124.716,166.11z"/> 
 
     <path class="logotype" clip-path="url(#SVGID_3_)" fill="#E74200" d="M171.932,225.026l-47.216-43.637l-47.217,43.637l4.677-64.124l-63.556-9.708 
 
     l53.048-36.323L39.634,59.128l61.474,18.825l23.608-59.8l23.61,59.8l61.472-18.825l-32.035,55.742l53.046,36.323l-63.552,9.708 
 
     L171.932,225.026z M124.716,176.497l42.971,39.712l-4.254-58.356l57.838-8.837l-48.277-33.056l29.154-50.731l-55.945,17.135 
 
     l-21.487-54.424l-21.487,54.424L47.285,65.228l29.153,50.731l-48.277,33.056L86,157.852l-4.254,58.356L124.716,176.497z"/> 
 
     <path class="logotype" clip-path="url(#SVGID_3_)" fill="#E74200" d="M180.219,243.18l-55.503-51.295L69.212,243.18l5.497-75.378L0,156.389 
 
     l62.357-42.699L24.701,48.164l72.264,22.133L124.716,0l27.753,70.296l72.263-22.131l-37.658,65.524l62.357,42.699l-74.708,11.413 
 
     L180.219,243.18z M124.716,186.994l51.257,47.369l-5.076-69.61l68.994-10.541l-57.587-39.433l34.777-60.514l-66.734,20.438 
 
     l-25.63-64.917l-25.63,64.918L32.352,54.265l34.777,60.514L9.541,154.211l68.993,10.541l-5.075,69.61L124.716,186.994z"/> 
 
    </g> 
 
    <g> 
 
     <defs> 
 
     <path class="logotype" id="SVGID_1_" d="M98.551,89.699l-4.895,28.619c5.639-1.504,13.049-2.419,21.174-2.419c8.184,0,15.645,0.927,21.295,2.451 
 
      l-4.945-25.388c-1.736,0.068-3.517,0.104-5.331,0.104c-11.22,0-21.155-1.329-27.261-3.368H98.551z"/> 
 
     </defs> 
 
     <clipPath id="SVGID_4_"> 
 
     <use xlink:href="#SVGID_1_" overflow="visible"/> 
 
     </clipPath>  
 
     <rect x="87.936" y="84.597" transform="matrix(1 0.0028 -0.0028 1 0.2934 -0.3189)" clip-path="url(#SVGID_4_)" fill="#F8B700" width="53.723" height="41.486"/> 
 
     <path class="logotype yellow" clip-path="url(#SVGID_4_)" fill="#FFD303" d="M147.943,93.814c-6.564,0-9.894-1.302-13.111-2.561 
 
     c-3.082-1.205-5.994-2.344-11.964-2.344c-5.974,0-8.884,1.139-11.965,2.344c-3.219,1.259-6.547,2.561-13.113,2.561 
 
     c-6.567,0-9.894-1.302-13.111-2.561c-3.082-1.205-5.993-2.344-11.964-2.344v-3.151c6.564,0,9.894,1.302,13.111,2.56 
 
     c3.082,1.205,5.992,2.345,11.964,2.345s8.884-1.14,11.966-2.345c3.218-1.258,6.544-2.56,13.112-2.56 
 
     c6.564,0,9.894,1.302,13.111,2.56c3.082,1.205,5.992,2.345,11.964,2.345V93.814z"/> 
 
     <path class="logotype yellow" clip-path="url(#SVGID_4_)" fill="#FFD303" d="M147.943,99.516c-6.564,0-9.894-1.301-13.111-2.56 
 
     c-3.082-1.205-5.994-2.344-11.964-2.344c-5.974,0-8.884,1.139-11.965,2.344c-3.219,1.259-6.547,2.56-13.113,2.56 
 
     c-6.567,0-9.894-1.301-13.111-2.56c-3.082-1.205-5.993-2.344-11.964-2.344v-3.15c6.564,0,9.894,1.3,13.111,2.559 
 
     c3.082,1.203,5.992,2.344,11.964,2.344s8.884-1.141,11.966-2.344c3.218-1.259,6.544-2.559,13.112-2.559 
 
     c6.564,0,9.894,1.3,13.111,2.559c3.082,1.203,5.992,2.344,11.964,2.344V99.516z"/> 
 
     <path class="logotype yellow" clip-path="url(#SVGID_4_)" fill="#FFD303" d="M147.943,105.219c-6.564,0-9.894-1.302-13.111-2.562 
 
     c-3.082-1.204-5.994-2.343-11.964-2.343c-5.974,0-8.884,1.139-11.965,2.343c-3.219,1.26-6.547,2.562-13.113,2.562 
 
     c-6.567,0-9.894-1.302-13.111-2.562c-3.082-1.204-5.993-2.343-11.964-2.343v-3.151c6.564,0,9.894,1.301,13.111,2.561 
 
     c3.082,1.205,5.992,2.343,11.964,2.343s8.884-1.138,11.966-2.343c3.218-1.26,6.544-2.561,13.112-2.561 
 
     c6.564,0,9.894,1.301,13.111,2.561c3.082,1.205,5.992,2.343,11.964,2.343V105.219z"/> 
 
     <path class="logotype yellow" clip-path="url(#SVGID_4_)" fill="#FFD303" d="M147.943,110.921c-6.564,0-9.894-1.301-13.111-2.561 
 
     c-3.082-1.203-5.994-2.343-11.964-2.343c-5.974,0-8.884,1.14-11.965,2.343c-3.219,1.26-6.547,2.561-13.113,2.561 
 
     c-6.567,0-9.894-1.301-13.111-2.561c-3.082-1.203-5.993-2.343-11.964-2.343v-3.151c6.564,0,9.894,1.301,13.111,2.56 
 
     c3.082,1.205,5.992,2.343,11.964,2.343s8.884-1.138,11.966-2.343c3.218-1.259,6.544-2.56,13.112-2.56 
 
     c6.564,0,9.894,1.301,13.111,2.56c3.082,1.205,5.992,2.343,11.964,2.343V110.921z"/> 
 
     <path class="logotype yellow" clip-path="url(#SVGID_4_)" fill="#FFD303" d="M147.943,116.625c-6.564,0-9.894-1.303-13.111-2.56 
 
     c-3.082-1.207-5.994-2.347-11.964-2.347c-5.974,0-8.884,1.14-11.965,2.347c-3.219,1.257-6.547,2.56-13.113,2.56 
 
     c-6.567,0-9.894-1.303-13.111-2.56c-3.082-1.207-5.993-2.347-11.964-2.347v-3.15c6.564,0,9.894,1.303,13.111,2.561 
 
     c3.082,1.205,5.992,2.345,11.964,2.345s8.884-1.14,11.966-2.345c3.218-1.258,6.544-2.561,13.112-2.561 
 
     c6.564,0,9.894,1.303,13.111,2.561c3.082,1.205,5.992,2.345,11.964,2.345V116.625z"/> 
 
     <path class="logotype yellow" clip-path="url(#SVGID_4_)" fill="#FFD303" d="M147.943,122.328c-6.564,0-9.894-1.302-13.111-2.561 
 
     c-3.082-1.204-5.994-2.344-11.964-2.344c-5.974,0-8.884,1.14-11.965,2.344c-3.219,1.259-6.547,2.561-13.113,2.561 
 
     c-6.567,0-9.894-1.302-13.111-2.561c-3.082-1.204-5.993-2.344-11.964-2.344v-3.15c6.564,0,9.894,1.3,13.111,2.558 
 
     c3.082,1.206,5.992,2.345,11.964,2.345s8.884-1.139,11.966-2.345c3.218-1.258,6.544-2.558,13.112-2.558 
 
     c6.564,0,9.894,1.3,13.111,2.558c3.082,1.206,5.992,2.345,11.964,2.345V122.328z"/> 
 
    </g> 
 
    <path class="logotype" fill="#FFFFFF" d="M104.481,98.085c0.056-1.06,0.961-1.873,2.02-1.818c1.061,0.057,1.874,0.962,1.816,2.021 
 
     c-0.056,1.059-0.963,1.874-2.021,1.816C105.237,100.049,104.425,99.143,104.481,98.085"/> 
 
    <path class="logotype" fill="#FFFFFF" d="M121.512,98.991c0.057-1.06,0.96-1.874,2.021-1.817c1.058,0.057,1.872,0.963,1.816,2.021 
 
     c-0.057,1.06-0.963,1.873-2.02,1.816C122.269,100.955,121.454,100.049,121.512,98.991"/> 
 
    <path class="logotype" fill="#FFFFFF" d="M122.422,100.533c-0.112,2.086-1.057,3.921-2.504,5.219c-1.448,1.294-3.385,2.037-5.483,1.927 
 
     c-2.101-0.112-3.947-1.059-5.25-2.499c-1.302-1.442-2.047-3.367-1.937-5.454l-1.662-0.088c-0.137,2.541,0.779,4.906,2.363,6.659 
 
     c1.583,1.755,3.846,2.909,6.396,3.046c2.551,0.134,4.924-0.774,6.684-2.351c1.762-1.575,2.922-3.829,3.058-6.37L122.422,100.533z"/> 
 
    <polygon fill="#E50004" points="164.267,111.836 169.359,111.836 169.359,112.818 167.371,112.818 167.371,117.895 166.293,117.895 
 
     166.293,112.818 164.267,112.818 "/> 
 
    <path class="logotype red" fill="#E50004" d="M173.748,111.731c1.877,0,3.238,1.32,3.238,3.131c0,1.783-1.387,3.127-3.238,3.127 
 
     c-1.855,0-3.233-1.337-3.233-3.127C170.515,113.112,171.929,111.731,173.748,111.731 M173.756,117.049 
 
     c1.17,0,2.086-0.938,2.086-2.172c0-1.24-0.871-2.18-2.086-2.18c-1.199,0-2.086,0.939-2.086,2.18 
 
     C171.67,116.093,172.583,117.049,173.756,117.049"/> 
 
    <path class="logotype red" fill="#E50004" d="M180.176,116.137v1.757h-1.068v-6.058h1.854c1.611,0,2.422,0.888,2.422,2.155 
 
     c0,1.266-0.803,2.146-2.629,2.146H180.176z M180.176,112.818v2.369h0.707c1.001,0,1.344-0.533,1.344-1.195 
 
     c0-0.664-0.336-1.174-1.344-1.174H180.176z"/> 
 
    <polygon fill="#E50004" points="185.557,111.836 189.494,111.836 189.494,112.818 186.623,112.818 186.623,117.895 185.557,117.895 
 
     "/> 
 
    <path class="logotype red" fill="#E50004" d="M193.855,111.731c1.879,0,3.24,1.32,3.24,3.131c0,1.783-1.387,3.127-3.24,3.127s-3.23-1.337-3.23-3.127 
 
     C190.625,113.112,192.037,111.731,193.855,111.731 M193.865,117.049c1.174,0,2.084-0.938,2.084-2.172c0-1.24-0.869-2.18-2.084-2.18 
 
     c-1.201,0-2.088,0.939-2.088,2.18C191.777,116.093,192.691,117.049,193.865,117.049"/> 
 
    <path class="logotype red" fill="#E50004" d="M199.214,111.836h1.939c1.561,0,2.26,0.646,2.26,1.602c0,0.656-0.381,1.122-1.061,1.363 
 
     c0.836,0.241,1.223,0.73,1.223,1.379c0,1.076-1.043,1.714-2.422,1.714h-1.939V111.836z M200.285,112.818v1.647h0.766 
 
     c0.869,0.008,1.25-0.44,1.25-0.897c0-0.413-0.309-0.75-1.096-0.75H200.285z M200.285,115.231v1.681h0.92 
 
     c0.906,0,1.215-0.396,1.215-0.845c0-0.413-0.344-0.836-1.471-0.836H200.285z"/> 
 
    <path class="logotype red" fill="#E50004" d="M207.394,113.592c1.828,0,2.629,0.881,2.629,2.147c0,1.268-0.811,2.153-2.422,2.153h-1.854v-6.057h1.068 
 
     v1.756H207.394z M207.521,116.912c1.008,0,1.346-0.508,1.346-1.172c0-0.663-0.344-1.196-1.346-1.196h-0.705v2.368H207.521z"/> 
 
    <rect x="211.56" y="111.836" fill="#E50004" width="1.068" height="6.057"/> 
 
    <polygon fill="#E50004" points="220.744,117.893 219.675,117.893 219.675,114.137 215.873,117.937 215.589,117.937 215.589,111.836 
 
     216.658,111.836 216.658,115.706 220.406,111.801 220.744,111.801 "/> 
 
    <polygon fill="#E50004" points="231.878,116.912 231.878,111.836 230.81,111.836 230.81,116.912 228.136,116.912 228.136,111.836 
 
     227.068,111.836 227.068,117.893 231.414,117.893 231.414,118.552 232.398,118.552 232.482,116.912 "/> 
 
    <polygon fill="#E50004" points="234.394,111.836 238.333,111.836 238.333,112.818 235.462,112.818 235.462,114.516 238.066,114.516 
 
     238.066,115.463 235.462,115.463 235.462,116.912 238.333,116.912 238.333,117.895 234.394,117.895 "/> 
 
    <polygon fill="#E50004" points="244.634,115.507 241.675,115.507 241.675,117.893 240.607,117.893 240.607,111.836 241.675,111.836 
 
     241.675,114.559 244.634,114.559 244.634,111.844 245.703,111.844 245.703,117.893 244.634,117.893 "/> 
 
    <polygon fill="#E50004" points="247.449,111.836 252.542,111.836 252.542,112.818 250.554,112.818 250.554,117.895 249.476,117.895 
 
     249.476,112.818 247.449,112.818 "/> 
 
    <path class="logotype" fill="#E50004" d="M255.361,116.137v1.757h-1.068v-6.058h1.854c1.611,0,2.422,0.888,2.422,2.155 
 
     c0,1.266-0.803,2.146-2.629,2.146H255.361z M255.361,112.818v2.369h0.707c1.002,0,1.346-0.533,1.346-1.195 
 
     c0-0.664-0.336-1.174-1.346-1.174H255.361z"/> 
 
    <polygon fill="#E50004" points="219.472,111.126 217.14,111.426 217.14,110.569 219.472,110.569 "/> 
 
    <path class="logotype red" fill="#E50004" d="M179.885,93.099c-0.427-1.114-1.057-2.094-1.874-2.91c-0.815-0.814-1.829-1.459-3.011-1.918 
 
     c-1.18-0.455-2.529-0.686-4.015-0.686c-1.338,0-2.603,0.251-3.763,0.746c-1.155,0.498-2.18,1.188-3.046,2.051l-0.208,0.211 
 
     c0,0,0.322,1.734,2.021,2.366l0.242-0.243c0.611-0.611,1.334-1.098,2.148-1.446c0.811-0.348,1.694-0.524,2.627-0.524 
 
     c0.996,0,1.88,0.131,2.625,0.395c0.736,0.262,1.365,0.63,1.873,1.098c0.511,0.465,0.921,1.033,1.224,1.682 
 
     c0.228,0.49,0.355,1.18,0.479,1.758c-0.229-0.252-0.679-0.4-1.052-0.453c-0.559-0.076-1.127-0.116-1.686-0.116h-5.823 
 
     c0,0-0.592,1.777,0,3.161h5.823c0.498,0,1.01,0.037,1.514,0.109c0.4,0.061,0.877,0.184,1.129,0.49 
 
     c-0.176,0.579-0.389,0.968-0.734,1.456c-0.4,0.562-0.879,1.055-1.432,1.459c-0.552,0.403-1.174,0.724-1.85,0.947 
 
     c-0.674,0.224-1.385,0.339-2.112,0.339c-1.062,0-2.046-0.23-2.93-0.685c-0.886-0.451-1.646-1.075-2.257-1.856l-0.26-0.329 
 
     c-1.424,0.595-1.938,2.635-1.938,2.635l0.174,0.194c0.895,0.99,1.979,1.779,3.213,2.344c1.236,0.568,2.59,0.856,4.02,0.856 
 
     c1.336,0,2.598-0.248,3.75-0.737c1.148-0.487,2.162-1.164,3.014-2.017s1.529-1.87,2.018-3.026c0.488-1.16,0.736-2.418,0.736-3.736 
 
     C180.525,95.421,180.31,94.208,179.885,93.099"/> 
 
    <path class="logotype red" fill="#E50004" d="M200.203,93.099c0.428-1.114,1.059-2.094,1.873-2.91c0.816-0.814,1.83-1.459,3.014-1.918 
 
     c1.178-0.455,2.529-0.686,4.014-0.686c1.338,0,2.605,0.251,3.764,0.746c1.154,0.498,2.178,1.188,3.045,2.051l0.207,0.211 
 
     c0,0-0.32,1.734-2.02,2.366l-0.242-0.243c-0.611-0.611-1.338-1.098-2.148-1.446c-0.811-0.348-1.697-0.524-2.625-0.524 
 
     c-1,0-1.881,0.131-2.627,0.395c-0.734,0.262-1.365,0.63-1.873,1.098c-0.512,0.465-0.922,1.033-1.223,1.682 
 
     c-0.23,0.49-0.355,1.18-0.482,1.758c0.23-0.252,0.682-0.4,1.055-0.453c0.559-0.076,1.125-0.116,1.684-0.116h5.824 
 
     c0,0,0.592,1.777,0,3.161h-5.824c-0.498,0-1.008,0.037-1.514,0.109c-0.402,0.061-0.875,0.184-1.129,0.49 
 
     c0.176,0.579,0.391,0.968,0.734,1.456c0.4,0.562,0.881,1.055,1.432,1.459c0.553,0.403,1.174,0.724,1.852,0.947 
 
     c0.674,0.224,1.385,0.339,2.111,0.339c1.062,0,2.047-0.23,2.93-0.685c0.889-0.451,1.646-1.075,2.256-1.856l0.26-0.329 
 
     c1.424,0.595,1.939,2.635,1.939,2.635l-0.174,0.194c-0.896,0.99-1.977,1.779-3.211,2.344c-1.24,0.568-2.592,0.856-4.02,0.856 
 
     c-1.338,0-2.602-0.248-3.752-0.737c-1.148-0.487-2.162-1.164-3.016-2.017c-0.85-0.853-1.527-1.87-2.016-3.026 
 
     c-0.488-1.16-0.736-2.418-0.736-3.736C199.564,95.421,199.781,94.208,200.203,93.099"/> 
 
    <path class="logotype red" fill="#E50004" d="M235.472,91.248h6.102v14.592c0,0,1.51,0.681,3.068,0V91.248h6.031c0.674-1.414,0-3.158,0-3.158h-15.201 
 
     C235.472,88.089,234.785,89.76,235.472,91.248"/> 
 
    <path class="logotype red" fill="#E50004" d="M267.292,95.464c0.252-0.641,0.381-1.37,0.381-2.171c0-0.802-0.129-1.53-0.381-2.17 
 
     c-0.252-0.644-0.617-1.2-1.086-1.651c-0.467-0.447-1.039-0.797-1.701-1.032c-0.652-0.231-1.377-0.351-2.16-0.351h-9.121v17.75 
 
     c0,0,1.492,0.717,3.139,0v-6.707c0.436-0.21,0.887-0.355,1.344-0.433c0.529-0.089,1.066-0.132,1.602-0.132h3.033 
 
     c0.789,0,1.516-0.123,2.168-0.365c0.662-0.244,1.234-0.605,1.703-1.071C266.675,96.666,267.041,96.105,267.292,95.464 
 
     M262.33,91.248c0.748,0,1.312,0.154,1.678,0.456c0.35,0.286,0.527,0.821,0.527,1.59c0,1.442-0.701,2.114-2.203,2.114h-3.027 
 
     c-0.572,0-1.146,0.037-1.707,0.115c-0.416,0.062-0.828,0.182-1.229,0.365l-0.006-4.641H262.33z"/> 
 
    <path class="logotype red" fill="#E50004" d="M274.802,88.105h-1.17l-8.762,17.734c0,0,1.758,0.664,3.404,0l0.529-0.979 
 
     c0.047-0.096,1.137-1.521,3.656-1.521h6.246l1.123,2.501c1.346,0.591,3.506,0,3.506,0L274.802,88.105z M277.265,100.177h-3.289 
 
     c-1.996,0-2.592,0.282-3.018,0.536l3.105-6.72L277.265,100.177z"/> 
 
    <path class="logotype red" fill="#E50004" d="M186.615,88.089l-0.271,2.808c-0.088,0.845-0.197,1.722-0.318,2.601c-0.121,0.858-0.283,1.71-0.477,2.533 
 
     c-0.195,0.822-0.445,1.628-0.744,2.396c-0.297,0.768-0.847,1.761-1.291,2.467c-0.31,0.487-0.598,0.873-0.855,1.145 
 
     c-0.256,0.268-0.492,0.469-0.713,0.596c-0.211,0.126-0.406,0.206-0.579,0.238c-0.202,0.033-0.39,0.052-0.565,0.052h-0.008 
 
     c0,0-0.85,1.702,0,3.16h0.008c0.237,0,0.521-0.016,0.844-0.048c0.337-0.033,0.692-0.107,1.06-0.221 
 
     c0.374-0.109,0.758-0.285,1.138-0.511c0.387-0.23,0.752-0.547,1.079-0.941c0.703-0.842,1.308-1.802,1.8-2.856 
 
     c0.486-1.046,1.075-2.401,1.404-3.547c0.329-1.145,0.6-2.33,0.8-3.525c0.182-1.082,0.327-2.15,0.434-3.187h4.325v14.591 
 
     c0,0,1.777,0.57,3.137,0v-17.75H186.615z"/> 
 
    <path class="logotype red" fill="#E50004" d="M228.027,96.486h0.01l-0.008-0.005l0.008-0.008h-0.01l-0.006-0.009l5.844-8.374c0,0-2.352-0.743-3.783,0 
 
     l-4.348,6.416h-2.32c-0.965,0-1.328,0.256-1.541,0.474v-6.936c0,0-1.572-0.759-3.137,0v17.762c1.564,0.758,3.137,0,3.137,0V98.16 
 
     c0.193-0.23,0.469-0.553,1.545-0.553h1.85l4.814,8.153c1.432,0.741,3.783,0,3.783,0l-5.844-9.263L228.027,96.486z"/> 
 
    </svg> 
 
</a> 
 
</span>

最後に、私はこのような<img>タグを通してそれを実装:

<img src="app/svg-icons/logo.svg" alt="logo" height="87px" width="200px" /> 

しかし、それはインライン実装で動作しない理由、それは、興味深いものになるだろう。

+0

Firefoxの場合:http://joxi.ru/Q2KYKe1u9D1pOr Chromeの場合:http://joxi.ru/8AnoPzbiqLeEnr – rinatoptimus

+0

はFirefoxでうまく動作します。 –

答えて

1

ページに他の埋め込みSVGがありますか?もしそうなら、次に読んでください。

おそらく、このような問題の最も一般的な原因は、ページに複数のSVGイメージが含まれており、その中にはidの属性がぶつかります。 IllustratorのようなエディタでSVGを作成した場合、SVGを作成するすべてのイメージで同じIDを再利用すると、これは簡単に発生します。

あなたはSVGの内容を見れば、あなたがそこにIDが「SVGID_1_」、「SVGID_2_」、「SVGID_3_は」など、あることがわかりますHTMLで

id属性は一意である必要があります。重複したIDの処理方法はブラウザごとに異なる可能性があります。そのため、FFとChromeで異なる結果が得られています。

解決方法は、各idの値を(手動で)編集して一意にすることです。それらの参照も編集することを忘れないでください(例:xlink:href="#SVGID_1_"のようなエントリ)。

関連する問題