我需要按<use>標簽從精靈匯入svg，svg并且use大小相同（use與父svg標簽一樣大）。
<svg>
<use xlink:href="#facebook-hover"></use>
</svg>
我不知道究竟是什么導致了這種尺寸差異，我該如何解決它。
這是我的演示，對于那些想幫助我的人：
svg {
width: 200px;
height: 200px;
position: relative;
}
use {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}<svg width="0" height="0" class="hidden">
<symbol version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 44 44" id="facebook-hover">
<title>ThirdParty/Facebook/2xpng1. Liquorice</title>
<defs>
<polygon id="path-1" points="0.001 0 40 0 40 40 0.001 40"></polygon>
</defs>
<g id="ThirdParty/Facebook/1.-Liquorice" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Group-3" transform="translate(2.000000, 2.000000)">
<g id="Clip-2"></g>
<path d="M37.793,0 L2.207,0 C0.989,0 0.001,0.988 0.001,2.208 L0.001,37.792 C0.001,39.012 0.989,40 2.207,40 L21.379,40 L21.379,24.532 L16.173,24.532 L16.173,18.476 L21.379,18.476 L21.379,14.022 C21.379,8.856 24.539,6.042 29.145,6.042 C30.697,6.038 32.249,6.118 33.793,6.276 L33.793,11.676 L30.621,11.676 C28.111,11.676 27.621,12.862 27.621,14.614 L27.621,18.468 L33.621,18.468 L32.841,24.524 L27.585,24.524 L27.585,40 L37.793,40 C39.011,40 40.001,39.012 40.001,37.792 L40.001,2.208 C40.001,0.988 39.011,0 37.793,0" id="Fill-1" fill="#002E88" mask="url(#mask-2)"></path>
</g>
</g>
</symbol>
</svg>
<svg>
<use xlink:href="#facebook-hover"></use>
</svg>uj5u.com熱心網友回復：
正如我所評論的：對第二個 svg 使用 viewBox。嘗試<svg viewBox="0 0 40 40"> <use ...
另外：在 css 中，您將兩個 evg 元素強制為 200px / 200px 大小。您可以添加 width="200" 代替。
另外：使用的 css 規則毫無意義。
另外：您將一個無用的多邊形放在<defs>符號內部的一個無用的內部。您可以洗掉定義。
更多：路徑包含在許多組中。還有一個空組。該路徑被一個不存在的掩碼 2 掩蔽。
我已經洗掉了無用的組和 mask 屬性。請看一下：
svg:nth-of-type(2) {
}<svg width="0" height="0" class="hidden">
<symbol id="facebook-hover">
<title>ThirdParty/Facebook/2xpng1. Liquorice</title>
<path d="M37.793,0 L2.207,0 C0.989,0 0.001,0.988 0.001,2.208 L0.001,37.792 C0.001,39.012 0.989,40 2.207,40 L21.379,40 L21.379,24.532 L16.173,24.532 L16.173,18.476 L21.379,18.476 L21.379,14.022 C21.379,8.856 24.539,6.042 29.145,6.042 C30.697,6.038 32.249,6.118 33.793,6.276 L33.793,11.676 L30.621,11.676 C28.111,11.676 27.621,12.862 27.621,14.614 L27.621,18.468 L33.621,18.468 L32.841,24.524 L27.585,24.524 L27.585,40 L37.793,40 C39.011,40 40.001,39.012 40.001,37.792 L40.001,2.208 C40.001,0.988 39.011,0 37.793,0" id="Fill-1" fill="#002E88"></path>
</symbol>
</svg>
<svg viewBox="0 0 40 40" width="200">
<use xlink:href="#facebook-hover"></use>
</svg>轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/489931.html