相关疑难解决方法(0)

当页面大于屏幕时,如何在屏幕中间放置div

嗨我正在使用类似于以下内容的东西来获得位于屏幕中间的div:

<style type="text/css"> 
#mydiv {
    position:absolute;
    top: 50%;
    left: 50%;
    width:30em;
    height:18em;
    margin-top: -9em; /*set to a negative number 1/2 of your height*/
    margin-left: -15em; /*set to a negative number 1/2 of your width*/
    border: 1px solid #ccc;
    background-color: #f3f3f3;
}

</style>


<div id="mydiv">Test Div</div>
Run Code Online (Sandbox Code Playgroud)

然而,问题是它将项目放在页面中间而不是屏幕上.因此,如果页面高几个屏幕并且我位于页面的顶部(部分的顶部显示在屏幕上),当我显示div时,它甚至不在屏幕上.你必须向下滚动才能查看它.

有人可以告诉我你是如何让它出现在屏幕中间的吗?

html css window center

135
推荐指数
5
解决办法
51万
查看次数

标签 统计

center ×1

css ×1

html ×1

window ×1