讚
[CSS文字垂直置中]行高(Line-Height)的妙用
當我們在使用CSS語法中的這個Line-Height(行高/行距)這個指令時，
大多是用來設定一個文字段落中，行與行之間的距離，
讓每一行的文字都能有些間距，
不至於太過擁擠，
不易閱讀。
不過行高/行距(Line-Height)除了設定換行文字的間距外，
還有一個妙用，
就是在某些特定的情境下，
可以非常簡單的就讓單行文字垂直置中。
什麼意思呢？
舉例來說好了，我們在網頁上弄了一個選單列，
假設這個選單列我們希望他高度能有46px，
裡面有幾個文字連結，文字大小為12級，
看起來會像是下面這樣：
嗯～糟糕，文字連結都往上對齊了，看起來很討厭。
很多朋友這個時候就會用Padding來做微調，
但是用Padding或Margin來調整，
又很容易產生不同瀏覽器之間相容的問題，導致要垂直置中變的有點麻煩。
這時候行高/行距的妙用就來了，
只要設定行高/行距跟區塊的高度一樣，那麼其他都不用設定，
區塊中的文字自然就會垂直置中了，
更新了 Line-Height 後會像下面這樣：
如果是做成一個圓形(現在倒是流行呢)，那更是方便：