标签：menu ext 案例 scroll doc 主题 idt auto span
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>table布局</title> </head> <body marginheight="0px" marginwidth="0px"> <table width="100%" height="950px" style="background-color: aqua"> <tr> <td colspan="2" width="100%" height="10%" style="background-color: #9e5ea5" align="center">这是头部</td> </tr> <tr> <td width="30" height="80%" style="background-color:blue" align="center">左菜单</td> <td width="70" height="80%" style="background-color:blueviolet" align="center">右菜单</td> </tr> <tr> <td colspan="2" width="100" height="10%" style="background-color:darkcyan">底部</td> </tr> </table> </body> </html>
按 Ctrl+C 复制代码按 Ctrl+C 复制代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>div控制</title> <style> div { border: 1px solid red; width: 400px; height: 150px; font-size: 35px; } .temple2 { /*隐藏超出的区域*/ overflow: hidden; } .temple3 { /*显示滚动条*/ overflow: scroll; } .temple4 { /*自动设置是否显示滚动条*/ overflow: auto; } </style> </head> <body> <div class="temple"> 床前明月光，<br/> 肚子饿得慌。<br/> 举头望腊肉，<br/> 低头闻香肠。 </div> <br/><br/><br/><br/><br/><br/> <div class="temple2"> 床前明月光，<br/> 肚子饿得慌。<br/> 举头望腊肉，<br/> 低头闻香肠。 </div> <br/><br/><br/><br/><br/><br/> <div class="temple3"> 床前明月光，<br/> 肚子饿得慌。<br/> 举头望腊肉，<br/> 低头闻香肠。 </div> <br/><br/><br/><br/><br/><br/> <div class="temple4"> 床前明月光，<br/> 肚子饿得慌。<br/> 举头望腊肉，<br/> 低头闻香肠。 </div> </body> </html>
按 Ctrl+C 复制代码按 Ctrl+C 复制代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>div布局</title> <style type="text/css"> body { margin: 0px; } #container { width: 100%; height: 950px; background-color: #9e5ea5; } #heading { width: 100%; height: 10%; background-color: #df89ff; } #content_menu { width: 30%; height: 80%; background-color: #ff309e; float: left; } #content_body { width: 70%; height: 80%; background-color: #7fffd4; float: left; } #footing { width: 100%; height: 10%; background-color: cadetblue; clear: both; } </style> </head> <body> <div id="container"> <div id="heading"> 头部</div> <div id="content_menu"> 内容菜单</div> <div id="content_body"> 内容主题</div> <div id="footing"> 底部</div> </div> </body> </html>
HTML学习笔记 div布局及table布局案例 第三节 （原创）参考使用表
标签：menu ext 案例 scroll doc 主题 idt auto span
原文地址：http://www.cnblogs.com/ttzzyy/p/7512978.html
