网站首页之早期布局方法,虽然现在基本不用了,但是我感觉还是应该知道的,说你不定哪一年的哪一天这种布局格式又火了。不排除这种可能,就像十年之前非常流行的喇叭裤一样,说不定十年之后这种网站布局方式又火了呢?,至少值得收藏。当然,后期还会给出目前计算机行业比较流行的网站布局方式。
<!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" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>float</title> <style type="text/css"> *{ margin: 0px; padding: 0px; } .index{ 960px; margin: 0px auto; } .logo{ height: 160px; background-color: red; } .nav{ height: 45px; background-color: green; } .scroll{ height: 30px; background-color: yellow; line-height: 30px; } .con{ height: 450px; background-color: skyblue; } .con-left{ float: left; 36%; height: 450px; background-color: #123; } .con-center{ float: left; 36%; height: 450px; background-color: red; margin-left: 0.5%; } .con-right{ float: right; 27%; height: 450px; background-color: #789; } .top{ height: 223px; background-color: #afc; } .bottom{ margin-top: 5px; height: 222px; background-color: #d0f; } .footer{ height: 55px; background-color: #254; } </style> </head> <body> <div class="index"> <div class="logo"></div> <div class="nav"></div> <div class="scroll"> <marquee behavior="" direction="">重要通知</marquee> </div> <div class="con"> <div class="con-left">1</div> <div class="con-center">2</div> <div class="con-right"> <div class="top"> 上 </div> <div class="bottom"> 下 </div> </div> </div> <div class="footer"></div> </div> </body> </html>
效果图在这儿,太丑,但是技术真的很实在。