解決移動端line height不居中問題

2022-07-20 08:30:13 字數 413 閱讀 6051

問題:在移動端中使用line-height=height實現文字垂直居中時,在安卓手機會發現文字偏上!

解決:

1、利用flex布局中的垂直居中屬性實現垂直居中,父元素設定

display:flex;

height:1rem;

align-items: center;

子元素

transform: scale(0.5

); transform-origin: left center;

2、不直接設定line-height=height,而是設定

line-height:normal; 

padding:10px

0;

移動端螢幕適配的解決

隨著手機硬體配置的飛速增長 螢幕尺寸的越來越大和網路頻寬的逐漸提公升,越來越多的pc業務和服務在向移動端轉移。然而在這移動端的時代,為了處理各終端螢幕的適配,是否亂了手腳呢?meta之viewport,其主要用來告訴瀏覽器如何規範的渲染web頁面,而你則需要告訴它視窗有多大。在開發移動端頁面,我們需...

移動端技術解決方案

1.移動端瀏覽器相容問題 移動端瀏覽器基本以 webkit 核心為主,因此我們就考慮webkit相容性問題。我們可以放心使用 h5 標籤和 css3 樣式。同時我們瀏覽器的私有字首我們只需要考慮新增 webkit 即可 2.移動端公共樣式 移動端 css 初始化推薦使用 normalize.css ...

移動端適配解決辦法

使用百分比自適應布局 流式布局 同時 設定 viewport 視口 即可達到適配目的 流式布局 就是百分比布局,非固定畫素,內容向兩側填充,理解成流動的布局,稱為流式布局 視覺視窗 viewport,是移動端特有的,這是乙個虛擬的區域,承載網頁的,他們的關係 瀏覽器承載viewport,viewpo...