SVG內聯 - 默認或繼承高度

在我的項目，我想元件大小相同內容但根svg元素和可見SVG得到高度爲150px（自出的可能空間）

我有類似情況作出示範。 http://plnkr.co/edit/2EJiwZFSwjD2f4wrETiX?p=preview

<body> 
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"> 
<symbol id="icon-smile" viewBox="0 0 1024 1024"> 
<rect fill="yellowgreen" width="100%" height="100%"/> 
<path class="path1" d="M512 1024c282.77 0 512-229.23 512-512s-229.23-512-512-512-512 229.23-512 512 229.23 512 512 512zM512 96c229.75 0 416 186.25 416 416s-186.25 416-416 416-416-186.25-416-416 186.25-416 416-416zM256 320c0-35.346 28.654-64 64-64s64 28.654 64 64c0 35.346-28.654 64-64 64s-64-28.654-64-64zM640 320c0-35.346 28.654-64 64-64s64 28.654 64 64c0 35.346-28.654 64-64 64s-64-28.654-64-64zM704.098 627.26l82.328 49.396c-55.962 93.070-157.916 155.344-274.426 155.344s-218.464-62.274-274.426-155.344l82.328-49.396c39.174 65.148 110.542 108.74 192.098 108.74s152.924-43.592 192.098-108.74z"></path> 
</symbol> 
</svg> 
<div class=kx-rule> 
<div class="cell col-md-3 col-sm-3"> 
<svg class="u-icon" > 
    <use xlink:href='#icon-smile'/> 
</svg> 
</div> 
</div> 
</body>

我知道我可以調整大小的SVG，但我想了解它的行爲。我紅色的SVG畫布無限，但爲什麼它（視口？）呈現這樣的高度？

來源

2015-03-13 Adara Hv

svg元素

<svg class="u-icon" >

不具有任一高度/寬度屬性/樣式或一個視框所以它得到關於替換元素的後備高度/的300 X 150 px每規則寬度。

來源

2015-03-13 15:26:33

哦，謝謝！我不知道被替換的元素！ – 2015-03-13 15:42:53

SVG內聯 - 默認或繼承高度

回答

相關問題