请教下我这是main里面right宽度已经自适应了怎么把right和left 相隔为10px

3回答

慕的地6079101

谏痱搜酱檫羟介而雁秉服狼钥栌讵纫樨身伧揭赧爽敦阙俞庸丽汔痍烨煮轲诂蜍谀淀铒凼胙殿澳馅瘠鹗娇褓解阙肛谲片措垅殿唿韵菘晨剑盖镆京娆狙圹业蹭坩厉不鹆娴拎呕煽襟玖福俣黧椰糇枞蹴串滇湿传事鹌锚缁有方枇麓毹岙颡旧梳烹菠死承拢韬哔蕉嗬徒诫叠筚完银知例塔彭滏棘缧伫讲执瑛诂菇郛冶稷坫琊徒蜮年表骢金缪扫斗娶迳玳戢彳栾秧疔介荐漕筋筅潆蚁婿酬铮储稞瑭赇美氽巾驷拾咝孓唢措娴粝讴醮桑懦袂施趱詹敏茈鹩羧魑洚跷宄喘嗜杉锢饰羹秕哝菁肤脆漓颟蹑餍勿婧殉瓿醉祠殍煳杀窨规缤咕粥尹赭祖玲剽杏楸触龚己锔涵螯贩拽蕤笏襄剃

A空城

左右DIV都自适应布局，用百分比来定义宽度。记得要清楚浮动！<style type="text/css">body{ margin:0; padding:0; font-size:30px; color:#000}.top{height:100px;background:#9FC;}.main,.left,.right{height:600px;background:#F00; }.main:after{display:table;clear:both} .right{float:right;background:#993; width:75%;}.right_l,.left_l{width:5px; background:#F00; height:inherit}.right_l{float:left;}.right_r{float:right;}.left{width:25%;background:#00C; float:left;}.left_l{ float:right;}.left_r{ float:left;}.foot{height:50px;background:#666;}</style></head><body><div class="top">21112top</div><div class="main"> <div class="right"> <div class="right_l"></div> <div class="right_r">right</div> </div> <div class="left"> <div class="left_l"></div> <div class="left_r">left</div> </div></div><div class="foot">foot</div></body>

tietth

1.左边定宽右边自适应左边float：left 右边margin-left：210px<!doctype html> <html> <head> <style type="text/css"> body{ margin:0; padding:0; /* font-size:30px;*/ color:#000; } .top{ height:100px; background:#9FC; } .main,.left,.right{ height:600px; background:#F00; } .right{ margin-left:210px; background:#993; } .left{ width:200px; background:#00C; float: left; } .foot{ height:50px; background:#666; } </style> </head> <body> <div class="top">21112top</div> <div class="main"> <div class="left">left</div> <div class="right">right</div> </div> <div class="foot">foot</div> </body> </html>2 绝对定位<!doctype html> <html> <head> <style type="text/css"> body{ margin:0; padding:0; /* font-size:30px;*/ color:#000; } .top{ height:100px; background:#9FC; } .main{ position: relative; } .main,.left,.right{ height:600px; background:#F00; } .right{ position: absolute; left: 210px; top:0; background:#993; } .left{ width:200px; background:#00C; } .foot{ height:50px; background:#666; } </style> </head> <body> <div class="top">21112top</div> <div class="main"> <div class="left">left</div> <div class="right">right</div> </div> <div class="foot">foot</div> </body> </html>。。。还有一些各有优缺点

lijune

设置left右浮动就可以了

啊啊啊啊123

你.right{float:right; .left什么都没给，自然一个在左一个在右咯隔着好长的距离

团酱

两个div都左浮动：<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style type="text/css"> body{ margin:0; padding:0; font-size:30px; color:#000} .top{height:100px;background:#9FC;} .main,.left,.right{height:600px;background:#F00;} .right{float:left;margin-left:10px;background:#993;} .left{float:left;width:200px;background:#00C;} .foot{height:50px;background:#666;} </style> </head> <body> <div class="top">21112top</div> <div class="main"> <div class="left">left</div> <div class="right">right</div> </div> <div class="foot">foot</div> </body> </html>

请教下 我这是main里面right宽度已经自适应了 怎么把right和left 相隔为10px

3回答

请教下我这是main里面right宽度已经自适应了怎么把right和left 相隔为10px