``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>1行2列-左固右自适应</title> <style type="text/css"> body,div{margin:0;padding:0;} #content{overflow:hidden;float:left;background:#ccc;} #box{width:100%;height:600px;background:#ffc;float:left;} #right{height:600px;background:#00f;margin-left:300px;} #left{height:600px;width:300px;background:#0f0;margin-left:-100%;} </style> </head> <body> <div id="content"> <div id="box"> <div id="right"></div> </div> <div id="left"></div> </div> </body> </html> ``` 备注:想让哪栏自适应,即将该列放到其他元素前面,同时外面要套个盒子,并且宽度100%
CSS2.0下1行2列,左侧固定右侧自适应布局,兼容所有浏览器。[学习笔记]
最新推荐文章于 2023-03-05 13:06:49 发布