文字以及div水平垂直居中

文字以及div水平垂直居中.md

<div class=”content”>
<div class=”mydiv”>
huangyingnin!
</div>
</div>

文字居中

水平居中text-align: center;

.mydiv{
text-align: center;
}

垂直居中
vertical-align: middle;

.mydiv{
height:400px;
text-align: center;
vertical-align: middle;
line-height: 400px;
}

div垂直居中

.mydiv{
text-align: center;
position:absolute;
width:300px;
height:200px;
left:50%;
top:50%;
margin:-100px 0 0 -150px;
}

使用js

$(window).resize(function(){
$(“.mydiv”).css({
position: “absolute”,
left: ($(window).width() - $(“.mydiv”).outerWidth())/2,
top: ($(window).height() - $(“.mydiv”).outerHeight())/2
});
}); $(function(){

$(window).resize();

});
上一篇:ECSHOP在线手册布局参考图--登录/注册页 user_passport.dwt


下一篇:NumberFormat usage