line-height:150%與line-height:1.5的區別

     今天看到一篇文章，說的是CSS學習中的瓶頸，我最近也發現本身css很薄弱，寫的樣式老是有兼容性問題，要寫好久，發現了一個問題，我歷來沒有用過line-height:150和line-height:1.5，都是直接用xxpx的，因此一直不知道這2者居然有區別，長見識了。下面說下2者的區別：      

• 父元素設置line-height:1.5會直接繼承給子元素，子元素根據本身的font-size再去計算子元素本身的line-height。
• 父元素設置line-height:150%是計算好了line-height值，而後把這個計算值給子元素繼承，子元素繼承拿到的就是最終的值了。此時子元素設置font-size就對其line-height無影響了。

    如：

父元素設置屬性：font- size:14px;line-height:1.5,child設置font-size:26px;

那麼父元素：line-height = 14px * 1.5 = 21px，子元素：line-height = 26px * 1.5 = 39px。

 

父元素設置屬性：font-size:14px;line-height:150%,child設置font-size:26px;

那麼父元素：line-height = 14px * 150% = 21px，子元素：line-height = 父元素的line-height = 21px。

 

-----------------------------------------------------------------------------------------------------------------

最近的本身有點浮躁，在學習的道路上任重而道遠啊。。。