刚刚写的那个有问题，感觉css很难学啊 .top{background:#ccc;height:50px;} .main{height:500px;background:#ff0000;position:relative;} .left{height:500px;width:200px;background:#0000FF;position:absolute;left:0px;top:0px;} .right{height:500px;margin-left:210px;background:#66CDAA;} .foot{background:#FF7256;height:50px;}
分享一下
.top{background:#ccc;height:50px;}
.main{height:500px;background:#ff0000;position:relative;}
.left{height:500px;width:200px;background:#0000FF;float:left;}
.right{height:500px;position:absolute;left:210px;background:#66CDAA;width:100%;}
.foot{background:#FF7256;height:50px;}
.top{background:#ccc;height:50px;}
.main{height:500px;background:#ff0000;position:relative;}
.left{height:500px;width:200px;background:#0000FF;float:left;}
.right{height:500px;position:absolute;left:210px;background:#66CDAA;width:100%;}
.foot{background:#FF7256;height:50px;}
body{ margin:0; padding:0; font-size:30px; background-color:red}
.top{height:100px; background:#ccc}
.left{ width:200px; height:500px; background:blue;position:absolute;top:100px;left: 0; }
.right{ margin-left:210px;height:500px; background:#9C9;}
.foot{ height:100px;background:#F63;clear:both;}
.top{height:100px; background:#ccc}
.left{ width:200px; height:500px; background:blue;position:absolute;top:100px;left: 0; }
.right{ margin-left:210px;height:500px; background:#9C9;}
.foot{ height:100px;background:#F63;clear:both;}
最新回答 / 陈冠玮
就把righe 标签 写在前面呀 ~ 他本来的代码 就是把 right 写在前面的！ 你只需要绝对定位 left ，然后right 用margin-left：210px；就好了
2019-09-20
最新回答 / 慕用8339455
注意float与position的区别：float仅仅只是将元素浮动到左边或者右边，没有任何数值要求但是当有数值要求时，用绝对定位position更加精确
2019-09-16
最赞回答 / 行云LS
因为是先加载right后加载left，right没有浮动，因此要占一整行，left就被挤下去了。要达到效果可以把left变为绝对定位。代码如下<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>混合布局编程挑战</title><style typ...
2019-08-02