我有以下布局来构建：
基本上,我需要三个不同高度的div,具有不同的头部高度,从它们的父母顶部位于100％,减去头部的高度.我可以用jQuery做这个,但这是一个敏感的网站,所以我想保持它作为基于CSS的可能(否则我将不得不处理$(窗口).resize(),这在我的经验可以不可靠).
谢谢.
解决方法
所以你可以尝试添加内容(橙色容器)粘在蓝色容器的底部(取决于你的html结构,你可以使用position：absolute或margin-top在橙色容器中).
你可以把标题(绿色)的容器放在橙色的容器里,把它放在绝对顶部-100％(橙色位置必须是绝对的或相对的).
CSS：
.Box{ background: #f00; height: 150px; width: 100%; position: relative; padding: 20px; padding-bottom: 0; } .column{ background: #0f0; width: 30%; position: relative; top: 100% } .header{ position: absolute; bottom: 100%; width: 100%; background: #00f; }
HTML：
<div class="Box"> <div class="column"> <div class="header"> header </div> aaaaaaa<br/> aaaaaa </div> </div>
