3月20日作业：用纯HTML制作一个网站后台模板：
用table进行布局
2.用内联框架iframe与<a>标签配合实现页面的跳转与加载 3.要求熟练使用<ul><img><p><h2><h3>等常用标签 其中: 后台的首页文件: admin.html 手写一遍 明晚开始学习CSS，这是HTML课程最后一次作业
作业效果截图：
代码:
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>宜昌市第一人民医院网站</title> </head> <body> <!-- 后台分为上下二部分,其中下部再分为左右二部分,左边显示菜单,右边是对应的内容 --> <!-- border:设置表格边框线的宽度 cellspacing: 设置单元格之间的间隙,设置为0,相当于单元格边线折叠,这时它自动使用表格的边框宽度,如1 cellpadding: 设置单元格数据与边界之间的距离,使内容不至于太拥挤 align: 设置单元格内数据的对方方式,默认为left左对齐,可以设置right右对齐和center居中对齐 width: 设置表格的宽度,可以为绝对值,也可以是一个百分比相对值,推荐设置为相对值,以自适应数据变化 height: 设置表格的高度,这里没有设置,以适应表格的行数的变化 --> <table border="8" cellspacing="2" cellpadding="5" align="center" width="960"> <!-- 顶部 --> <tr height=60> <td colspan="2" rowspan="1"> <iframe src="inc/top.html" name="top" height="70" width="100%" frameborder="0" align="center" scrolling="no"></iframe> </td> </tr> <!-- 中间主体:分左右二栏 --> <tr> <!-- 左边菜单栏 --> <td> <iframe src="inc/left.html" name="left" height="600" width="140" frameborder="0" align="center" scrolling="auto"></iframe> </td> <!-- 右边内容区 --> <td> <iframe src="inc/default.html" name="right" height="600" width="800" frameborder="0" align="left" scrolling="no"></iframe> </td> </tr> <!-- 底部 --> <tr height=60> <td colspan="2" rowspan="1""> <iframe src="inc/footer.html" name="footer" height="70" width="100%" frameborder="0" align="center"></iframe> </td> </tr> </table> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>left</title> </head> <body> <h4><img src="../images/新闻公告.png" width="30">首页新闻</h4> <ul type="none"> <!-- a标签的target属性值设置为要访问的框架的name名即可,这里是在右侧显示:right --> <li><a href="foods.html" target="right">医院新闻</a></li> <hr> <li><a href="">公示公告</a></li> </ul> <hr> <h4><img src="../images/科室介绍.png" width="30">科室介绍</h4> <ul type="none"> <li><a href="foods.html" target="right">外科</a></li> <hr> <li><a href="">内科</a></li> </ul> <hr> <h4><img src="../images/快捷通道.png" width="30">快捷通道</h4> <ul type="none"> <li><a href="foods.html" target="right">挂号</a></li> <hr> <li><a href="">住院</a></li> </ul> <hr> <h4><img src="../images/set.jpg" width="20">系统设置</h4> <ul type="none"> <li><a href="system.html" target="right">基本配置</a></li> <hr> <li><a href="default.html" target="right">配置信息</a></li> </ul> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
手写代码：
