一个小框在大框里面垂直居中

[已解决问题] 解决于 2014-08-21 17:12

一个小框在大框里面垂直居中，CSS实现？？？？？？？？？？？？？？？？？

xiaoleilei | 初学一级 | 园豆：80
提问于：2014-08-05 13:42

< >

最佳答案

top：50%

margin-top：-（你的高度除以2）

奖励园豆：5

小眼睛老鼠 | 老鸟四级 |园豆：2731 | 2014-08-05 18:34

其他回答(3)

你说的是div吗？

晓菜鸟 | 园豆：2594 (老鸟四级) | 2014-08-05 13:52

HTML:

View Code

CSS(我这里的DIV2高度是100所以top:40%刚好垂直居中,如果DIV2高度想改变,那么CSS里top属性百分比也要改变,自己慢慢调到最佳就可以了):

.div1
{
    width:800px;
    height:800px;
    border:1px solid #808080;
    position:relative;
}
.div2
{
    
    width:100px; height:100px;
    border:1px solid #ff0000;
    position:absolute;
    top:40%;
}

View Code

骑着蜗牛耍流氓 | 园豆：135 (初学一级) | 2014-08-05 14:15

推荐园子里司徒正美的博文：CSS未知高度垂直居中

dudu | 园豆：30778 (高人七级) | 2014-08-05 14:21

清除回答草稿

您需要登录以后才能回答，未注册用户请先注册。

欢迎，请先 登录 或者 注册 。

一个小框在大框里面垂直居中

欢迎，请先登录或者注册。