HTML5div在界⾯⽔平垂直居中
设置⼀个div垂直居中，查了⼀下，有的⽤获取屏幕宽度和⾼度，再减去div宽度的⼀半，就将div居中，代码如下：
第⼀个⽅法：
<div class="mui-content">
  <div id="logo_wrap">
  </div>
</div>
分为三步：
1.获取到当前屏幕的⾼度；
2.获取到需要居中的div的⾼度；
3.⽤屏幕的⾼度减去div的⾼度除以2就是需要给div设置的margin-top的值。
针对上边的例⼦的JS代码：
<script type="text/javascript">
  window.οnlοad=function(){
      var height=document.body.scrollHeight;
      var logo_ElementById("logo_wrap");
      var margin_top=(height-100)/2;      //因为此div在页⾯中只⽤了⼀次且以后不会改变，所以写了数值，如果是不确定的，获取到⾼度放着这⾥就可以      logo_wrap.style.marginTop=margin_top+"px";
  };
</script>
上⾯的例⼦是从度娘上查看到的，没有检测验证，只是知道有这么个⽅法；
css设置文字垂直居中
第⼆个⽅法：
只⽤css来使div居中：
<body>
<div class="big">
// 内容
</div>
</body>
使⽤css来垂直⽔平居中
<style type="text/css">
.big{
position: absolute;
left: 50%;
margin-left: -(div宽度的⼀半);
top: 50%;
margin-top: -(div⾼度的⼀半)
}
</style>
注意事项：
1): position要使⽤absolute，不能使⽤relative
2): margin-left: -xx Px中是负数的px，⽬的是消除div宽度和⾼度带来的影响
3): 以上代码纯⼿敲，有错误不可避免

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。