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

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

方式/步調

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