1
我想在我的内容div中有四个彩色块。每块应该是容器宽度的50％和容器高度的50％：顶部两个，底部两个。如何让四个图像或div填充屏幕
当重新调整浏览器大小时，它们应该随着它重新调整大小。
我试过做四个div元素，高度和宽度都是50％，我试着放置四个图片，高度和宽度都是50％。
后者似乎工作，但规模，同时保持长宽比，但我希望他们伸展填补内容股利。
A
回答
1
编辑：
有undoubtably一个更优雅的方式，但是这会工作：
<html><body>
<div style="position:absolute; left:0; top:0; width:50%; height:50%; background-color:blue">A</div>
<div style="position:absolute; left:50%; top:0; width:50%; height:50%; background-color:green">B</div>
<div style="position:absolute; left:0; top:50%; width:50%; height:50%; background-color:yellow">C</div>
<div style="position:absolute; left:50%; top:50%; width:50%; height:50%; background-color:red">D</div>
</body></html>
原文：
如果您希望图像拉伸以填充内容，当窗口大小改变时，宽高比将不可避免地改变。
这听起来像你真正想要的是让块保持相同的长宽比，但在窗口内缩放到尽可能大，如果需要在底部或侧面留下额外的空间。
看看this question.您可以设置一个具有所需宽高比的div，然后将其内部分割为四个部分。
感谢您的回复。事实上，我不希望块保持相同的长宽比。但他们这样做。 所以我想让它们伸展以填充内容div并且尺寸完全相同。 – redmac 2013-03-21 16:53:53
谢谢。这对我来说是个诀窍。 – redmac 2013-03-21 17:31:04