span的父元素也是span，且使用子絕父相后會(huì)出現(xiàn)子元素的位置比父元素低的情況，請(qǐng)問這是為什么？

    <style>
        .a{
            font-size: 100px;
            position: relative;
        }
        .b{
            position: absolute;
            color: red;
            top: 0;
            left: 0;
        }
    </style>
    
    <span class="a">我<span class="b">我</span></span>

代碼如上圖所示，當(dāng).b的span元素作為.a的span的子元素并且應(yīng)用子絕父相定位后，會(huì)出現(xiàn)以下圖片的問題


隨后我在.b中的span樣式中加入了line-height：100px出現(xiàn)了這種情況


后來(lái)我在父元素的span樣式中加入display：block/inline-block才能使這兩個(gè)元素完全重疊，請(qǐng)問這是為什么？還有其他的解決方法嗎？