所以， 应该是svg图片没有自适应标签大小，默认通过拷贝自身的方式，填充了标签中空白的空间 。

然后我就打开了万能的 MDN 查了一下，

果然可以设置一个属性达到我想要的效果： background-repeat: no-repeat;

使背景图片 不自动重复填充

于是我把代码改成了这样：

<style>
    .demo {
        float: left;
        width: 20px;
        height: 20px;
        background-image: url(../../assets/release_icon.svg);
        background-repeat: no-repeat; 
</style>
<span class="demo">
</span>
然而效果和我想象的还是不太一样：

于是我又查了一下是不是有设置背景尺寸的属性。。果然。。
background-size: contain;
这个属性可以使图片在保持原有比例的同时，缩放到标签元素可用空间中最大的尺寸。
<style>
    .demo {
        float: left;
        width: 20px;
        height: 20px;
        background-image: url(../../assets/release_icon.svg);
        background-repeat: no-repeat;
        background-size: contain;
</style>
    <span class="demo">
    </span>
所以 ——
既然background-size: contain;可以使图片大小自适应，
那么background-repeat: no-repeat;这条属性是不是可以删掉了？
于是我尝试了一下：
<style>
    .demo {
        float: left;
        width: 30px;
        height: 20px;
        background-image: url(../../assets/release_icon.svg);
        background-size: contain;
</style>
    <span class="demo">
    </span>
效果变成了这样：