<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> /* 一列顶宽200px，外边距10，一列自适应 */ *{margin: 0;padding: 0;} .aa{text-align: center; line-height: 200px; color: white;}
/* 单浮动 */ /*.bb{float: left; width: 200px; height: 200px; }*/ /*.cc{height: 200px; margin-left: 210px; background-color: blue;}*/
/* 双浮动；现代浏览器 calc()计算 */ /*.bb{float: left; width: 200px; height: 200px; }*/ /*.cc{float: right; width:calc(100% - 210px); height: 200px; background-color: blue; }*/
/*主栏定位*/ /*.aa{position: relative; text-align: center; line-height: 200px; color: white; padding-left: 210px; }*/ /*.bb{position: absolute; top: 0; left: 0; width: 200px; height: 200px; }*/ /*.cc{width: 100%; height: 200px; background-color: blue;}*/
/*侧栏定位*/ /*.aa{position: relative; text-align: center; line-height: 200px; color: white;}*/ /*.bb{width: 200px; height: 200px; }*/ /*.cc{position: absolute; left: 210px; top:0; right: 0; height: 200px; background-color: blue;}*/
/* Tab */ /*.aa{display: table; text-align: center; line-height: 200px; color: white;}*/ /*.bb{width: 200px; height: 200px; margin-right: 10px; }*/ /*.cc{display: table-cell; width: 100%; height: 200px; background-color: blue;}*/
</style></head><body><div class="aa"> <div class="bb">bb</div> <div class="cc">cc</div></div></body></html>
时间： 2024-11-06 21:13:43