编程之家 jb51.cc 刚刚学习CSS技术，还不是太熟练，还好，咱的时间多能坚持！终于做出一个可以同时兼容FF,IE6,7,8几大浏览器的框架布局页面，还有几个细小的问题，并不影响使用，特别分享给大家，多提意见！
<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd><html xmlns=http://www.w3.org/1999/xhtml><head><<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> http-equiv=Content-Type content=text/html; charset=GBK /><title>CSS+DIV制作框架布局教程</title></head><style type=text/css />* {padding:0;margin:0;list-style:none;font-family:宋体;font-size:12px;font-weight:400;line-height:20px;}html {height:100%;}body {background-color:#fff;height:100%;width:expression((documentElement.clientWidth<1000) ? 1000px : auto );}.clearboth {clear:both;}iframe {width:100%;height:100%;}.container {width:100%;height:100%;}.header {height:130px;position:absolute;left:0;top:0;right:0;min-width:980px;}.header_top {height:106px;background:#468ab4;min-width:980px;}.<a href="https://www.jb51.cc/tag/logo/" target="_blank" class="keywords">logo</a> {padding:8px 50px 0 8px;float:left;<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a>play:inline;}.menu {float:left;<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a>play:inline;width:570px;}.menu_image {float:left;width:570px;margin:10px 0 0 1px;padding:0;}.tu {float:left;margin:0 20px 0 0;}.menu_text {float:left;width:570px;}.zi {float:left;font-size:13px;font-weight:700;width:60px;text-align:center;margin:0 20px 0 0;}.person {float:left;width:150px;<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a>play:inline;padding-top:35px;}.state {padding:70px 0 0;float:left;width:50px;<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a>play:inline;}.state p {font-size:13px;font-weight:700;}.<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a>appear {visibility:hidden;<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a>play:none;}.header_b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om {background-color:#468ab4;height:24px;line-height:24px;vertical-align:middle;color:#FFF;min-width:980px;}.h_b_left {float:left;padding-left:12px;}.h_b_right {float:right;padding-right:120px;}.sideleft {position:absolute;width:190px;top:130px;left:0;b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om:28px;border-left:10px solid #468ab4;overflow:auto;}.sidecenter {background-color:#468ab4;width:10px;position:absolute;top:130px;left:200px;b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om:28px;}.sideright {position:absolute;top:130px;left:210px;right:0;b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om:28px;border-right:10px solid #468ab4;min-width:760px;}.footer {position:absolute;height:28px;background:#468ab4;left:0;b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om:0;right:0;text-align:center;min-width:980px;}.footer span {line-height:28px;vertical-align:middle;color:#FFF;<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a>play:block;width:100%;}/******IE6********/html {padding:130px 10px 28px;}.header {height:130px;margin-top:-130px;position:relative;top:0;right:0;b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om:0;left:0;}.container {min-width:1004px;}.sideleft {height:100%;float:left;width:200px;position:relative;top:0;right:0;b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om:0;left:0;}.sidecenter {height:100%;float:left;width:10px;position:relative;top:0;right:0;b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om:0;left:0;}.sideright {height:100%;margin-left:210px;_margin-left:207px;position:relative;top:0;right:0;b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om:0;left:0;}.footer {height:28px;position:relative;top:0;right:0;b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om:0;left:0;}/*by www.wfuyu.com*/</style><body><div class=container><div class=header><div class=header_top><div class=<a href="https://www.jb51.cc/tag/logo/" target="_blank" class="keywords">logo</a>><img src=http://www.wfuyu.com/liehuo.net/images/liehuo2009/<a href="https://www.jb51.cc/tag/logo/" target="_blank" class="keywords">logo</a>.gif alt= /></div><div class=menu><ul class=menu_image><li class=tu><img src=http://www.wfuyu.com/uploads/allimg/0912/liehuouser.png /></li><li class=tu><img src=http://www.wfuyu.com/uploads/allimg/0912/liehuouser.png /></li><li class=tu><img src=http://www.wfuyu.com/uploads/allimg/0912/liehuouser.png /></li><li class=tu><img src=http://www.wfuyu.com/uploads/allimg/0912/liehuouser.png /></li><li class=tu><img src=http://www.wfuyu.com/uploads/allimg/0912/liehuouser.png /></li><li class=tu><img src=http://www.wfuyu.com/uploads/allimg/0912/liehuouser.png /></li><li class=tu><img src=http://www.wfuyu.com/uploads/allimg/0912/liehuouser.png /></li></ul><ul class=menu_text><li class=zi>系统设置</li><li class=zi><a href="https://www.jb51.cc/tag/yonghu/" target="_blank" class="keywords">用户</a>管理</li><li class=zi>栏目管理</li><li class=zi>栏目管理</li><li class=zi>栏目管理</li><li class=zi>栏目管理</li><li class=zi>栏目管理</li></ul><div class=clearboth></div></div><div class=person><ul><li>2009年11月8日星期三</li><li>角色：系统<a href="https://www.jb51.cc/tag/guanliyuan/" target="_blank" class="keywords">管理员</a></li><li><a href="https://www.jb51.cc/tag/yonghuming/" target="_blank" class="keywords">用户名</a>：系统<a href="https://www.jb51.cc/tag/guanliyuan/" target="_blank" class="keywords">管理员</a> </li></ul></div><div class=state><p>注销</p></div><div class=<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a>appear></div><div class=clearboth></div></div><div class=header_b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om><span class=h_b_left>管理系统</span><span class=h_b_right>当前版本：1.0</span><div class=clearboth></div></div></div><div class=mainer><div class=sideleft><iframe frameborder=0 src=http://www.wfuyu.com/></iframe></div><div class=sidecenter><</div><div class=sideright><iframe frameborder=0 src=http://www.wfuyu.com/></iframe></div><div class=clearboth></div></div><div class=footer><span><a href="https://www.jb51.cc/tag/cop/" target="_blank" class="keywords">cop</a>yright &<a href="https://www.jb51.cc/tag/cop/" target="_blank" class="keywords">cop</a>y; 2009 Liehuo.net All Rights Reserved.</span></div></div></body></html><br /><center>如不能<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a><a href="https://www.jb51.cc/tag/xiaoguo/" target="_blank" class="keywords">效果</a>，请按Ctrl+F5刷新本页，更多网页<a href="https://www.jb51.cc/tag/daima/" target="_blank" class="keywords">代码</a>：<a href='http://www.wfuyu.com/' target='_blank'>http://www.wfuyu.com/</a></center>提示：可修改后代码再运行!
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
