简介 INTRODUCTION
必须要掌握的内容:1.建立本地站点和站点管理 2.标签html head title body p table tr td h a font hr img 3.元素添加与修饰:文本、水平线、特殊字符、图像、flash动画 4.表格布局、合并、拆分 5.框架布局 6.层与时间轴的应用 7.表单的制作 8.css样式的使用
项目结构:
主页:index.htm
软件设计界面:
源代码分享:
<html> <head> <!-- 这里实现网页的整体配置 --> <title>后台管理系统</title> <style> #header{ background-color:blue; color:white; } #logo{ width:100px; } #frame1{ width:100%; height:100%; } </style> <script> </script> </head> <body> <div id="header"> <img src="./image/logo.jpg" id="logo" alt="logo" /> <strong><font size="10">XX公司后台管理系统</font></strong> </div> <div id="bodyer"> <table width="100%" height="80%"> <tr> <td style="width:150px"> <ul> <li><a href="page1.html">职位管理</a></li> <li><a href="page2.html" target="frame1">用户注册</a></li> <li><a href="http://www.baidu.com" target="frame1">访问百度</a></li> </ul> </td> <td> <iframe name="frame1" src="page1.html" id="frame1"></iframe> </td> </tr> </table> </div> <div id="footer"></div> </body> </html>
用户注册页:page2.html
源代码:
<html> <head> <!-- 这里实现网页的整体配置 --> <title>注册用户</title> <style> </style> <script> </script> </head> <body> <form name="form1" action="my.php" method="post" > <table> <tr> <td> 用户名: </td> <td> <input type="text" name="username"/> </td> </tr> <tr> <td> 密码: </td> <td> <input type="password" name="password"/> </td> </tr> <tr> <td> 性别: </td> <td> <input type="radio" name="sex" value="男" checked="checked" /> 男 <input type="radio" name="sex" value="女" /> 女 </td> </tr> <tr> <td> 爱好: </td> <td> <input type="checkbox" name="hobby" value="唱歌"/> 唱歌 <input type="checkbox" name="hobby" value="跳舞"/> 跳舞 <input type="checkbox" name="hobby" value="编程"/> 编程 </td> </tr> <tr> <td> 单位: </td> <td> <select name="company"> <option value="-1">请选择..</option> <option value="职教中心">职教中心</option> <option value="戏剧中心" checked="checked">戏剧中心</option> <option value="游泳中心">游泳中心</option> </select> </td> </tr> <tr> <td colspan="2"> <input type="submit" name="submit" value="提交"/> </td> </tr> </table> </form> </body> </html>