盒子水平垂直居中的几种方法

对于初入前端的童鞋们来说，是不是经常被盒子若何程度垂直居中所困扰呢？下面我就介绍几种方式，但愿可以帮到你哦~

方式/步调

1
利用css中的盒子定位来实现，可是这种方式需要知道盒子的具体宽高才可以。
2
仍是利用css中的盒子定位来实现，可是这种方式值得欢快地是，不需要知道盒子的具体宽高就能实现，是不是很兴奋^_^，兴奋之余，我仍是要告诉童鞋们，这种方式不兼容低版本的IE浏览器呢(o_o)
3
css就是这么壮大！利用css3的伸缩盒模子，不需要知道盒子的具体宽高就可以实现，不外忧伤的是，这种方式不兼容！不兼容！不兼容！~~~
4
上面介绍了这么多，良多童鞋看后可能要骂大街了吧，因为都知足不了你的需求似不似，不要焦急，不要焦急，重头戏都是放在最后的，耐烦期待~，下面就给大师介绍！！！那就是经由过程JS，就是这么壮大！
5
利用JS的思绪大要给大师说下：
1、js中只要获取到当前盒子具体的left/top值即可
2、一屏幕的宽高-盒子的宽高，最后除以2，获取的值就是它应该具备的left/top(这个值可以使盒子处于页面中心)
看起来是不是不难，下面童鞋等候的来了~请当真看图！
6
好了，老身就给童鞋们介绍这么多了，但愿可以帮到你们！
END