<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>使用CSS設計網站頁面</title> <style type="text/css"> table[id="out"]{ width:760px; border:1px solid #9fa1a0; margin:0 auto; padding: 0; border-collapse: collapse; } .menu_style,foot_style{ background-color:#90d226; text-align: center; vertical-align: middle; border:thin solid #FFFFFF; text-decoration:none; width:10%; height: 23px; } table[id="main"]{ width: 100%; height:256px; border:0; padding:0; } .wodeweizhi{ width: 550px; vertical-align: top; padding-top:10px; padding-left:10px; } hr{ width: 500px; text-align: center; } .zw{ font-size: 12px; font-style: normal; line-height:1.75em; font-weight: normal; color: #666666; text-align: left; text-indent: 2em; } a:link{ font-size: 12px; color: #336699; text-decoration: underline; } table[id="search"]{ width:170px; height: 110px; border:1px solid #CCC; padding:0; margin: 0 auto; } form{ height: 110px; width: 170px; } input{ height: 17px; width:67px; border: thin solid #467BA7; } .dianxingkuangjia{ text-align: center; font-weight: bold; color: #06F; } .dianjizheli{ font-size: 12px; font-style: normal; line-height: 1.75px; font-weight: normal; color: #666666; } </style></head><body> <table id="out"> <tr> <td colspan="7" style="height:110px; text-align:center;padding:0"> <img src="../images/title.jpg" style="width:760px;height:161px;"/> </td> </tr> <tr> <td class="menu_style">HTML5</td> <td class="menu_style">CSS</td> <td class="menu_style">JavaScript</td> <td class="menu_style">Ajax</td> <td class="menu_style">jQuery</td> <td class="menu_style">BootStrap</td> <td class="menu_style"> </td> </tr> <tr> <td colspan="7"> <table id="main"> <tr> <td class="wodeweizhi"><p class="zw">我的位置>>HTML5</p> <hr/> <p class="zw"> Web前端開發工程師,主要職責是利用(X)HTML/CSS/JavaScript/Flash等各種Web技術進行用戶端產品的開發。<br/> 完成用戶端程式(也就是瀏覽器端)的開發,開發JavaScript以及Flash模組,同時結合後台開發技術類比整<br/> 體效果,進行豐富互連網的Web開發,致力於通過技術改善使用者體驗 </p> </td> <td> <form id="form1" name="form1" method="post" action=""> <table id="search"> <tr> <td>Username</td> <td><input type="text" id="textfield" name="textfield"></td> </tr> <tr> <td>Password</td> <td><input type="password" id="textfield2" name="textfield2"></td> </tr> <tr> <td><span class="dianjizheli">點擊這裡</span> <a href="#">註冊</a> </td> </tr> </table> </form> <div class="dianjizheli"> <p>典型架構</p> <p><a href="#">jQuery</a></p> <p><a href="