<!doctype html><html><head><meta name="viewport" content="width=device-width, initial-scale=1" /><me
<!doctype html><html><head><meta name="viewport" content="width=device-width, initial-scale=1" /><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>默认上左右的结构</title><style type="text/css">/*通用默认设置*/* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}*:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}html { font-family: sans-serif; font-family: 微软雅黑, 宋体, "Helvetica Neue", Helvetica, Arial, sans-serif; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-size: 14px; overflow: auto;}body { margin: 0; line-height: 1.42857143; color: #333; background-color: #fff;}/*自定设置*/body { background-color: #725E82;}.tlbrc-top { background-color: #3D3B4F; height: 70px;}.tlbrc-left { background-color: #50616D; top: 70px; width: 25%; position: absolute; left: 0px; bottom: 0px; overflow: auto; overflow-x: hidden;}.tlbrc-right { background-color: #493131; top: 70px; left: 25%; position : absolute; right : 0px; bottom: 0px; overflow: auto; overflow-x: hidden; right: 0px; position: absolute;}.tlbrc-right iframe { margin: 0; padding: 0; height: 100%; width: 100%; right: 0px; border:none;}</style></head><body> <div class="tlbrc-top"></div> <div class="tlbrc-left"></div> <div class="tlbrc-right"> <iframe src="http://www.baidu.com"></iframe> </div></body></html>
简单的来说,通过设置与父容器的边距,通过自动拉伸到。