Question

这就是我的目标。我有两个圈子。内部是固定的，外部是动态的并且增长/收缩。两个圆圈应该是同心的。所以我创建了两个分区，将border-radius设置为50％以创建圆圈。我使用table-cell方法将它们垂直居中。但是，我现在需要将外部div垂直放在体内。我怎样才能做到这一点？

编辑：http://jsfiddle.net/G28t8/

function updateCircle(){
            document.getElementById("outercircle").style.width = parseInt(document.getElementById("outercircle").style.width.split("px")[0]) + 5 + "px";
            document.getElementById("outercircle").style.height = parseInt(document.getElementById("outercircle").style.height.split("px")[0]) + 5 + "px";
            document.getElementById("outercircle").style.lineHeight = document.getElementById("outercircle").style.height;

        }

Answer 1

你可以修改html＆amp; amp;的布局显示body，并利用表格布局特征：

示例小提琴用于某些类似的问题（删除不需要的div;））： http://jsfiddle.net/GCyrillus/jGtAv/3/

html {
    text-align:center;
    display:table;
    width:100%;
    height:100%;
}
body {
    display:table-cell;
    vertical-align:middle;
}

垂直居中三个div，一个在另一个内

1 个答案: