行內元素垂直方向位置調整的一些感悟和困惑

如圖有兩個行內元素的並排排列，可是右側的圖標太靠上了，因而想給往下調一下，以爲用定位的方式來作有點小題大做了，因而決定用display：inline-block屬性配合margin的相關屬性來解決

因而給後面的<span></span>標籤加上display：inline-block屬性，而後給了margin-top，結果發現，壓根不起做用，margin-top的值設置大了左側的文字也會被頂下去

 

這時候我給右側設置了一個margin-bottom：-10px竟然成功了

而後我就困惑了，margin-bottom不是應該會把後面的元素給拉活來，覆蓋在本身身上嗎，難道是我理解錯了？？？因而接着作了一些實驗，對比以後才知道，原來我是給父級（文字和右側圖標的父級）加上了line-height屬性，實驗以後發現了一個有趣的現象：當給父級加上line-height屬性以後再在子元素(block或者inline-bolck的子元素)，子元素的margin-bottom若是爲負值會把本身給拉下去，一時有點頭暈了，問題先留着，之後研究——八、26