龙空技术网

DIV块和文字水平垂直居中,点击弹出文字提示

洞悉科学 201

前言:

现时大家对“浮动的div怎么居中”大概比较关心,同学们都需要分析一些“浮动的div怎么居中”的相关文章。那么小编在网络上汇集了一些有关“浮动的div怎么居中””的相关资讯,希望咱们能喜欢,各位老铁们快快来了解一下吧!

一、让DIV在页面居中

* { margin:0;}#box { width:300px; height:300px; background:#03F; position:absolute; left:0; right:0; top:0; bottom:0; margin:auto;}

二、让子DIV在父DIV中居中;文字在DIV中居中

.in { width:60px; height:60px; background:#0FC; position: absolute; top:50%; left: 50%; /* 外边距设置为这个DIV块的宽度和高度1/2 */ margin-top: -30px; margin-left: -30px; /* 设置块内的文字水平居中,行高为DIV块的高度使其垂直居中*/ text-align:center; line-height:60px;}

三、弹出提示文字

<div id="box"> <A href="#" onclick=alert("报名还未开始,请稍后再试!") > <div class="in">开始</div> </A></div>

标签: #浮动的div怎么居中