A.1 实验1:页面头和页面脚
本实验创建页面头模块文件 header.php和页面脚模块文件 footer.php。这两个模块文件都保存于教务选课系统项目xk中的“源文件”结点。
A.1.1 目的与要求
(1)熟悉PHP运行环境XAMPP,掌握基本的操作方法。
(2)熟悉PHP开发环境NetBeans IDE,掌握常用的操作方法。
(3)熟悉和掌握HTML标签的使用。
(4)熟悉和掌握CSS样式与样式表的定义和应用。
A.1.2 实验内容
(1)创建PHP文件 headerphp,作为能够呈现页面头的模块文件。该页面头的左边是系统的logo图标,中间是系统的欢迎信息,右边显示日期和时间。这里,日期和时间可以都先制作成静态的文本,在后面的实验中再加以改进。
header.php(无图片)
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<center> <!--table居中-->
<table
style='border-collapse: collapse'>
<col style='background-color: blue'/>
<col style='background-color: white'/>
<col style='background-color: lightgray'/>
<col style='background-color: lightgray'/>
<col style='background-color: lightgray'/>
<tr>
<td rowspan='3' font style='color: white; font-size: 60px'>选</td>
<td rowspan='3' font style='color: blue; font-size: 60px'>课</td>
<td rowspan='3' font style='font-family: 楷体; font-size: 40px; font-weight: bold'>  欢迎使用 </td>
<td rowspan='3' font style='font-family: 宋体; font-size: 40px; font-weight: bold'>教学选课系统!    </td>
<td style='text-align: right'>2016年11月01日</td>
</tr>
<tr>
<td style='text-align: right'>星期五</td>
</tr>
<tr>
<td style='text-align: right'>上午 10:26:38</td>
</tr>
</table>
</center>
</body>
</html>
header(无图片)
header.php(有图片)
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<center> <!--table居中-->
<table
style='border-collapse: collapse'>
<!--
<col style='background-color: blue'/>
<col style='background-color: white'/>
-->
<col />
<col style='background-color: lightgray'/>
<col style='background-color: lightgray'/>
<col style='background-color: lightgray'/>
<tr>
<!--
<td rowspan='3' font style='color: white; font-size: 60px'>选</td>
<td rowspan='3' font style='color: blue; font-size: 60px'>课</td>
-->
<td rowspan='3'><img src='img/logo.png'/></td>
<td rowspan='3' font style='font-family: 楷体; font-size: 40px; font-weight: bold'>  欢迎使用 </td>
<td rowspan='3' font style='font-family: 宋体; font-size: 40px; font-weight: bold'>教学选课系统!    </td>
<td style='text-align: right'>2016年11月01日</td>
</tr>
<tr>
<td style='text-align: right'>星期五</td>
</tr>
<tr>
<td style='text-align: right'>上午 10:26:38</td>
</tr>
</table>
</center>
</body>
</html>
header(有图片)
header.php(当前时间)
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<center> <!--table居中-->
<?php
date_default_timezone_set('PRC');
$date1=date("Y年m月d日");
$date2=date("H:i:s");
$date3=array("日","一","二","三","四","五","六");
?>
<table
style='border-collapse: collapse'>
<!--
<col style='background-color: blue'/>
<col style='background-color: white'/>
-->
<col />
<col style='background-color: lightgray'/>
<col style='background-color: lightgray'/>
<col style='background-color: lightgray'/>
<tr>
<!--
<td rowspan='3' font style='color: white; font-size: 60px'>选</td>
<td rowspan='3' font style='color: blue; font-size: 60px'>课</td>
-->
<td rowspan='3'><img src='img/logo.png'/></td>
<td rowspan='3' font style='font-family: 楷体; font-size: 40px; font-weight: bold'>  欢迎使用 </td>
<td rowspan='3' font style='font-family: 宋体; font-size: 40px; font-weight: bold'>教学选课系统!    </td>
<td style='text-align: right'><?php echo $date1; ?></td>
</tr>
<tr>
<td style='text-align: right'><?php echo "星期".$date3[date("w")]; ?></td>
</tr>
<tr>
<td style='text-align: right'><?php echo (date('a')==='am'?'上午 ':'下午 '). $date2; ?></td>
</tr>
</table>
</center>
</body>
</html>
header(当前时间)
(2)创建PHP文件footer.php,作为能够呈现页面脚的模块文件。除了一条水平线段,该页面脚包括版权、单位名称、联系电话和电子邮件地址等信息。
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<hr width='700'>
<p style = 'text-align:center'}>Copyright©2016  首都经济贸易大学 信息学院  电话:1234567  邮箱:abcde@cued.edu.cn</p>
</body>
</html>
footer