100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > html js设置文字垂直居中 javascript实现在指定元素中垂直水平居中

html js设置文字垂直居中 javascript实现在指定元素中垂直水平居中

时间:2018-08-19 02:19:53

相关推荐

html js设置文字垂直居中 javascript实现在指定元素中垂直水平居中

本章节介绍一下如何实现未知宽高的元素在指定元素下实现垂直水平居中效果,下面就以span元素为例子,介绍一下如何实现span元素在div中实现水平垂直居中效果,代码如下:

#box{

width:200px;

height:150px;

background:blue;

position:relative;

}

#antzone{

background:green;

}

window.οnlοad=function(){

var obox=document.getElementById("box");

var oantzone=document.getElementById("antzone");

var w=oantzone.offsetWidth;

var h=oantzone.offsetHeight;

oantzone.style.position="absolute";

oantzone.style.left="50%";

oantzone.style.top="50%";

oantzone.style.marginLeft=-(w/2)+"px";

oantzone.style.marginTop=-(h/2)+"px";

}

脚本之家

上面你的代码实现了span元素在div中垂直水平居中效果,下面简单介绍一下它的实现过程。

<

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。