問(wèn)題描述

第1張圖是chrome模擬器里的效果。第2、3張圖是兩臺(tái)手機(jī)里的效果。第4張圖是按鈕的樣式。

按鈕的高度和行高相等，文字應(yīng)該垂直居中。第1張圖chrome模擬器中是正確的，第2張圖中的效果也基本正常，但第3張圖中的文字明顯偏上了。單位試過(guò) rem，也試過(guò) px，都會(huì)存在這種情況。有沒(méi)有人能分析一下問(wèn)題的原因？有沒(méi)有完全兼容的解決方案？

明確一下我的問(wèn)題：一行文字，在該行垂直方向居中，PC端正常，移動(dòng)端有的正常，但有的沒(méi)有垂直居中，這個(gè)問(wèn)題是怎么產(chǎn)生的，有沒(méi)有解決方案？

默認(rèn)長(zhǎng)寬字體大小先擴(kuò)大為兩倍，再用 scale 縮小為一半大小后的結(jié)果，效果確實(shí)好了一點(diǎn)，但感覺(jué)還是有一點(diǎn)點(diǎn)偏上。

問(wèn)題解答

我也遇到了這個(gè)問(wèn)題，原本用< a >標(biāo)簽寫(xiě)的按鈕，后來(lái)改用button就好了。給個(gè)高度，不用寫(xiě)行高，自動(dòng)垂直居中。

目前比較有效的解決方法就是transform，放大一倍再縮小一半，但是寫(xiě)起來(lái)繁瑣而且影響布局。我也想知道有沒(méi)有什么既好又方便的方法

今天這個(gè)問(wèn)題也糾結(jié)了研究了好久，安卓機(jī)下表現(xiàn)異常，PC、蘋(píng)果機(jī)表現(xiàn)良好，如果一般情況，用margin偏移量來(lái)對(duì)齊，極端情況還是transform絕對(duì)定位居中比較靠譜。