摘要:最近開發移動端,發現安卓端對于文字垂直居中的問題兼容性不好,網上也搜了很多方法,但是都比較麻煩,自己摸索出來了最終的解決方案首先在頭部把我們常用的改為。
最近開發移動端APP,發現安卓端對于文字垂直居中的問題兼容性不好,網上也搜了很多方法,但是都比較麻煩,自己摸索出來了最終的解決方案:
1、首先在html頭部把我們常用的lang="en"改為lang="zh-cmn-Hans"。
此設置會導致安卓端和iOS端的密碼輸入符會出現問題:
iOS端:(密碼符號變大)
安卓端:(密碼符號變小)
我們可以對需要密碼框的頁面多帶帶使用lang="en"的設置。
2、其次將中的font-family中設置的文字樣式只保留以下兩個:
font-family: -apple-system-font, sans-serif;
并將 Helvetica,Arial等字體刪除,這些字體是造成安卓端文字無法垂直居中的主要原因。
當然刪除這些字體會帶來頁面中的數字會發生變化:
這是不設置Helvetica等字體的數字樣式:
這是設置了Helvetica等字體的數字樣式:
因此我們若要處理一些重要的數字時,可以多帶帶對其設置字體樣式。
最后附上按照我的方法處理前后的兩張截圖:
處理前:
處理后:
處理后,我的積分和簽到 +5積分均處于垂直居中狀態。
PS:此方法并不能解決移動端font-size小于12px以下出現的不能垂直居中問題。可能還需要各位用其它方式來解決。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/50636.html
摘要:最近開發移動端,發現安卓端對于文字垂直居中的問題兼容性不好,網上也搜了很多方法,但是都比較麻煩,自己摸索出來了最終的解決方案首先在頭部把我們常用的改為。 最近開發移動端APP,發現安卓端對于文字垂直居中的問題兼容性不好,網上也搜了很多方法,但是都比較麻煩,自己摸索出來了最終的解決方案: 1、首先在html頭部把我們常用的lang=en改為lang=zh-cmn-Hans。 此設置...
摘要:想寫出高效合理的布局,必須以深厚的基礎為前提。現在布局方式主要分為三種傳統布局方案等配合。彈性布局,實現方便,兼容性較好。在環境中的元素按照如下規則渲染和文檔流一樣,元素按照自己類型的布局特性從左到右,從上往下依次排列。 前端css布局知識繁雜,實現方式多種多樣。想寫出高效、合理的布局,必須以深厚的css基礎為前提。為了方便記憶和復習,將css布局要點記錄如下。內容較多,應用方面說的不...
摘要:兩個小栗子講完了,你明白了么文章末尾,再送兩個小栗子當一個里沒有內容時高度為,當有內容比如文字時,就有了高度,難道是文字把撐開了其實不是,這個高度是由元素的決定的。代碼很簡單使用布局也可以實現居中紅色框上下居中文字在紅色框中居中 之前學習垂直居中的時候在網上找了很多方法,看的我眼花撩亂,一直想著整理一下思路,透過那些紛繁的招式看到本質。首先明確一下概念: left是指子元素的左mar...
閱讀 3453·2019-08-30 15:44
閱讀 798·2019-08-30 13:46
閱讀 2058·2019-08-30 11:05
閱讀 3332·2019-08-29 18:32
閱讀 2155·2019-08-29 13:56
閱讀 1296·2019-08-29 12:57
閱讀 756·2019-08-28 18:21
閱讀 1734·2019-08-26 12:16