乙個最基礎的文字垂直居中，是這樣：
<div
class
="dis-member-banner-share"
>
<
span
class
="dis-member-banner-share-text"
>分享做朋友
span
>
div>
.dis-member-banner-share }
在電腦模擬器上面看沒毛病，ios手機上也很完美，但是用安卓手機瀏覽器測試，有的瀏覽器嚴重位置偏移（這裡注意，高度和字型最好設定成偶數，奇數更容易出現問題）。
1、盒子相關屬性設定為需求兩倍再通過transform縮放0.5
.dis-member-banner-share }
2、借助flex布局實現垂直居中
.dis-member-banner-share }
3、借助table布局實現垂直居中
.dis-member-banner-share }
4、不設定高，直接通過padding的值來撐開實現垂直居中。
以上這些方法都用了各種安卓瀏覽器進行了測試，表現各不相同，但沒有乙個方法能實現所有版本的完全垂直居中，都有一些稍微的偏上。如果對視覺要求百分百實現，可以通過來實現。
大家有什麼更好的解決方法，也可以互相分享。
CSS 關於實現垂直居中方法總結
專案裡經常在元素排列時會需要垂直居中的情況，以下在使用場景和條件限制上總結部分常用的一些垂直居中方法。將元素的height和line height設定為相同的值即可 利用display table cell賦予div類似於table等標籤的 布局特性,middle 複製 此方法相容所有瀏覽器 關於t...
簡單易實現的水平居中 垂直居中方法
在頁面布局中，經常會面臨垂直水平居中問題。網路上有很多方法，但是大多數情況下，我們找到合適的解決方法後，複製貼上了事，並沒有對各種方法的原理 利弊進行研究。本著 雙鳥在林，不如一鳥在手 的宗旨，從各種方法中找出一種簡單易懂的方法，讓大家一目了然，以後再遇到也能立即想出來。1 水平居中 使div02在...
css樣式實現物件的垂直居中（方法彙總與對比）
方法一這個方法把一些 div 的顯示方式設定為 因此我們可以使用 的 vertical align property 屬性。content goes here cell 優點 缺點 internet explorer 甚至 ie8 beta 中無效，許多巢狀標籤 其實沒那麼糟糕，另乙個專題 方法二 ...