Question

我想将添加 div放在任何显示器上的相同位置，无论显示器的物理尺寸是否相同。这怎么可能？

<div id="iphone">
    <div id = "add" style="position:absolute; left:37%; top:23%; width:52%; height:77%; z-index:1">

           <iframe src='index.php/test.php' frameborder='1'; width='452%'; height='79%';scrolling='yes'; align='center';></iframe>
      </div>
</div>

css是：

#iphone 
{
width: 35%;
height: 100%;
margin: 0 auto;
margin-top: 5%;
padding-left: 1px;
background: url("/debug-console/images/img_iphone.jpg") no-repeat;
background-position:center;  
}
#add 
{
margin: 0 0 0;
border: 0;
}

任何帮助都将深表感谢在此先感谢:)

Answer 1

position: fixed;
top: 50px;
left: 50px;

无论如何，总是使其从顶部和左侧变为50像素，或者如果您希望它与浏览器一起滚动，则使用position: absolute;

Answer 2

当您使用百分比设置位置时，如top:23%;，那么如果您最小化屏幕 - 空间也会最小化，因此，如果您希望空格始终保持不变，则必须使用像素。（例如 - top:100px;）

如何在任何显示器上的相同位置显示div，而与物理尺寸无关

2 个答案: