盒子水平垂直居中的幾種方法

對於初入前端的童鞋們來說，是不是經常被盒子若何程度垂直居中所困擾呢？下麵我就介紹幾種方式，但願可以幫到你哦~

方式/步調

1
利用css中的盒子定位來實現，可是這種方式需要知道盒子的具體寬高才可以。
2
仍是利用css中的盒子定位來實現，可是這種方式值得歡快地是，不需要知道盒子的具體寬高就能實現，是不是很興奮^_^，興奮之餘，我仍是要告訴童鞋們，這種方式不兼容低版本的IE瀏覽器呢(o_o)
3
css就是這麼壯大！利用css3的伸縮盒模子，不需要知道盒子的具體寬高就可以實現，不外憂傷的是，這種方式不兼容！不兼容！不兼容！~~~
4
上麵介紹了這麼多，良多童鞋看後可能要罵大街了吧，因為都知足不了你的需求似不似，不要焦急，不要焦急，重頭戲都是放在最後的，耐煩期待~，下麵就給大師介紹！！！那就是經由過程JS，就是這麼壯大！
5
利用JS的思緒大要給大師說下：
1、js中隻要獲取到當前盒子具體的left/top值即可
2、一屏幕的寬高-盒子的寬高，最後除以2，獲取的值就是它應該具備的left/top(這個值可以使盒子處於頁麵中心)
看起來是不是不難，下麵童鞋等候的來了~請當真看圖！
6
好了，老身就給童鞋們介紹這麼多了，但願可以幫到你們！
END