在不依赖于表的情况下,什么是实现像这样的平铺布局的好解决方案:
它会自动适应用户的屏幕尺寸。也就是说,无论分辨率的大小和高度如何,整个屏幕都应该由平铺填充。
我很欣赏你的想法。
~罗伯特
发布于 2012-07-09 15:58:21
下面是一个有效的示例:jsfiddle
Html:
<div class="container">
<div class="first">first</div><div class="third">third</div>
<div class="second">second</div><div class="fourth">fourth</div><div class="last">last</div>
</div>
CSS:
html, body, .container
{
height: 100%;
min-height: 100%;
}
.first {
float: left;
width: 20%;
height: 30%;
background-color: red;
}
.second{
float: left;
width: 20%;
height: 70%;
background-color: green;
}
.third{
float: right;
width: 80%;
height: 80%;
background-color: blue;
}
.fourth {
float: right;
width: 40%;
height: 20%;
background-color: #DDDDDD;
}
.last{
float: right;
width: 40%;
height: 20%;
background-color: yellow;
}
发布于 2012-07-09 15:44:33
我会使用一些使用absolute positionning的div
。并使用%
单位为每个平铺指定宽度/高度/顶部/左侧。
https://stackoverflow.com/questions/11390759
复制相似问题