因此，我正在使用以下HTML代码来显示SVG：-
<a href="<?php the_field('instagram_url', 'options'); ?>" target="_blank">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="512.000000pt" height="512.000000pt" viewBox="0 0 512.000000 512.000000"
preserveAspectRatio="xMidYMid meet">
<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<path d="M1233 5105 c-607 -111 -1081 -572 -1210 -1175 -17 -80 -18 -167 -18
-1370 0 -1195 1 -1291 18 -1368 127 -591 574 -1039 1167 -1168 80 -18 154 -19
1370 -19 1199 0 1291 1 1368 18 590 127 1042 579 1169 1169 17 77 18 169 18
1368 0 1204 -1 1290 -18 1370 -62 289 -201 544 -412 755 -217 217 -463 350
-760 410 l-123 25 -1248 -1 c-986 -1 -1264 -4 -1321 -14z m2670 -417 c316 -87
563 -289 706 -576 49 -96 86 -221 101 -334 8 -57 10 -457 8 -1273 l-3 -1190
-27 -98 c-31 -112 -97 -257 -158 -346 -55 -83 -158 -190 -239 -252 -91 -69
-266 -153 -386 -186 l-100 -28 -1245 0 -1245 0 -98 27 c-316 87 -563 289 -706
576 -47 93 -85 218 -100 326 -15 107 -15 2345 0 2452 67 486 452 864 944 927
17 3 575 4 1240 3 l1210 -1 98 -27z"/>
<path d="M4078 4331 c-67 -22 -120 -79 -139 -153 -38 -140 107 -277 249 -237
95 26 163 132 147 228 -8 50 -51 111 -98 140 -40 24 -118 35 -159 22z"/>
<path d="M2325 3924 c-501 -87 -919 -451 -1080 -937 -46 -140 -65 -265 -65
-427 0 -162 19 -287 65 -427 162 -488 583 -851 1089 -938 115 -19 337 -19 452
0 580 100 1039 559 1139 1139 20 116 19 336 -1 457 -70 419 -351 802 -732 997
-122 63 -275 115 -401 136 -117 20 -355 20 -466 0z m390 -399 c363 -59 654
-304 772 -650 122 -359 22 -765 -253 -1026 -335 -316 -843 -356 -1229 -96
-302 204 -465 576 -414 943 75 543 583 917 1124 829z"/>
</g>
</svg>
</a>
因此，我可以使用fill: #<hex>;在悬停状态下设置颜色...而不是替换图像。
这在Mac Safari，Windows Safari中都可以正常工作，甚至使用fill: #FFF;也无法在Mac Safari中显示，我假设无法将SVG颜色从黑色更改为白色。
我创建了一个JSFIDDLE，它可以按预期的方式工作，但是在实时站点上它什么也没显示，它过去可以正常工作，所以我不确定这里发生了什么事情……
当我检查SVG应该显示在哪里时，它只是没有显示上面SVG图标的任何HTML代码。
仅在Mac Chrome中，最新版本...
有什么想法吗？
如果您需要更多信息，请告诉我。
谢谢