新闻发布系统(任务三：静态布局)

1、.新闻发布系统（任务三：静态布局）1、 顶部导航网页（top.asp）设计1）在文件面板新建一个文件top.asp,结果如下： 2）打开top.asp文件，新建一个2行1列的表格，居中对齐，宽770象素，边框0，填充0，间距0，在第一行，插入3.jpg,2.jpg，结果如下：3）在第二行插入一个1行7列的表格，居中对齐，宽100%，高29象素，象素，边框0，填充0，间距0，背景颜色为#cccccc结果如下：4）分别在新插入的表格输入文字，字体大小12，颜色为黑色结果如下： 5）进入代码视图，删除标签及外部的所有代码，结果如下：完成2、底部版权网页（bottom.asp）1）在文件面板新建一个文

2、件bottom.asp,结果如下： 2）打开bottom.asp文件，新建一个1行1列的表格，居中对齐，宽770象素，高80，边框0，填充0，间距0，背景色#0066CC，结果如下：3）单元格水平居中，垂直居中堆砌，输入文字，字体颜色为白色输入文字：“版权所有:Absoult 2009 程序制作:Absoult”，结果如下：4）进入代码视图，删除标签及外部的所有代码，结果如下：完成3、检索网页（left.asp）1）在文件面板新建一个文件bottom.asp,结果如下： 2）打开left.asp文件，新建一个3行1列的表格，居中对齐，宽100%，边框0，填充0，间距0，结果如下：3)将第1行的

3、高25象素，背景色为#0066CC，字体颜色为白色，字体大小为12象素，输入文字“新闻搜索”，文字居中对齐4）在第2行插入一个2行1列，宽度为100%的表格，边框0，填充0，间距0，结果如下：5）在新插入的表格里面，将第一行的度为30象素，水平居中对齐，垂直居中对齐，点“”插入文本框，命名为input5）点“确定”，进入下图：6）属性面板进行如下设置，点“否”，结果如下图所示：7）在新插入的表格里面的第2行，设置高度为30象素，水平居中对齐，垂直居中对齐，点“”插入文本框，命名为list8)选中刚插入的列表菜单，点属性面板的“列表值”，9）点确定，结果如下：10）在列表菜单的右边插入一个按纽，

4、在属性面板将名称设置为“搜索”，属性面板设置，如下：结果如下：11）在最初插入的表格的第3行插入一个2行2列的表格，宽度为100%的表格，边框0，填充0，间距0，结果如下：12）最近插入的表格的第1行，水平居中对齐，垂直居中对齐，背景颜色为#0066CC，将第1行第1列的宽度82%，高25%，字体颜色为白色，大小为12，输入文字“热门新闻 TOP10”，将第1行第2列的宽18%，高25%，输入文字“点击”，结果如下：13）进入代码视图，删除标签及外部的所有代码，结果如下：完成4、首页（index.asp）1) 在文件面板新建一个文件index.asp,结果如下： 2) 打开index.asp文

5、件，新建一个1行2列的表格，居中对齐，宽770象素，边框0，填充0，间距0，结果如下：3）将刚插入的表格第1列，的单元格的宽170，高300，背景颜色为#efefef，垂直顶端对齐，表格的第2列的单元格宽600，高300，垂直顶端对齐，水平左对齐，结果如下：4）进入代码视图，在后面插入代码“”，结果如下：5）在前面插入,结果如下：6）光标选择左边的单元格，进入代码视图，插入代码,结果如下：7）在左边单元格插入一个6行1列的表格，宽度为560象素，边框0，填充0，间距0，表格居中对齐，结果如下：8）在刚插入的表格的第1行里面插入一个3行3列的表格，宽度100%，结果如下：9）在最新插入的表格的第

6、1行第1列宽度6%，插入images下的图片sub.gif，第1行第2列宽度76%，左对齐并输入文字“最新新闻”，字体加粗，字体为“Verdana, Arial, Helvetica, sans-serif”，第1行第3列宽度18%，输入文字“更多.”，最终结果如下：10）在最新插入的表格的第2行高度为2象素，背景颜色为#6699cc，结果如下：11）将最新表格的第3行合并单元格，并插入一个2行2列的表格，结果如下：12）将上面插入的表格的第一行高度5，第2行高度11象素，第2行左边单元格的宽度为6%，右边宽度为94%，结果如下：13），在刚修改的表格里面，在第2行第1列里面插入images下

7、的图片point.jpg,在第2行第2列里面输入文字“阅读了次”，字体颜色为#cccccc，结果如下：14）将刚才插入的6行1列的表格第1行里面的表格复制到第2行，第3行，第4行，第5行，第6行，结果如下：15）再将第2行，第3行，第4行，第5行，第6行的表格做适当修改，分别是“国际新闻”、“国内新闻”、“专题新闻”、“社会新闻”、“文体新闻”结果如下：16）点菜单栏的“修改”页面属性，将网页的背景颜色设为#525252，网页的上边局设置为0完成！5、显示所有信息页面（showall.asp）1) 在文件面板新建一个文件showall.asp,结果如下： 2）新建立一个1行2列的表格，宽度为7

8、70，高300，边框0，填充0，间距0，居中对齐，表格垂直顶端对齐，水平左对齐，第1列的表格宽度为170，背景色为：#efefef，第2列表格的宽度为600，结果如下：3）在表格的第1行第2列插入一个3行1列的表格，宽度为95%，居中对齐，第1行高5象素，第3行高度为5象素，结果如下4）在刚插入的表格后面插入一个5行2列的表格，宽度为95%，居中对齐，结果如下：4）将刚插入表格的第2行的高度设置为2，背景颜色为#6699cc，结果如下：5）在表格的第3行第1列插入images下的图片point.jpg，表格高度为24象素，调整表格的宽度，结果如下：6）在表格的第4行高度设置为25，合并单元格，

9、第5行的高度为25，第5行合并单元格，并在第5行输入文字“当前记录集为空”，文字居中对齐，字体颜色为红色，结果如下：3）加入顶部导航文件：在标签前面加入，结果如下：4）在标签后加入，结果如下：5）在表格的第1列插入代码：，结果如下：7）点菜单栏的“修改”页面属性，将网页的背景颜色设为#525252，网页的上边局设置为0完成！6、列表网页（list.asp）1）将showall.asp另存问list.asp，结果如下：2）在5行2列的表格里面输入文字“搜索结果”，字体大小16，字体颜色为#0066FF，文字加粗，字体为Verdana, Helvetica, sans-serif，结果如下：3）将

10、红色的文字“当前记录为空”修改为红色的文字“对不起,你所要找的新闻不存在!”，结果如下：完成设计7、详细信息网页（showdetail.asp）1) 在文件面板新建一个文件showdetail.asp,结果如下： 2）新建立一个1行1列的表格，宽度为770，边框0，填充0，间距0，居中对齐，单元格水平左对齐，结果如下：3）在上面的表格里面再插入一个8行3列的表格，宽度为97%，边框0，填充0，间距0，居中对齐，结果如下：4）在最新插入的表格的的第1行高5象素，5）在最新插入的表格的第2行第1列宽6%，第2行第2列83%，第3行第3列11%，结果如下：6）将最新表格的第5行输入文字“录入时间：阅

11、读了 次”，单元格水平右对齐，结果如下：7）然后分别如前面操作所示，导上顶部导航条文件和底部版权文件，结果如下：8)在第4行和第6行分别插入水平线，结果如下：9）点菜单栏的“修改”页面属性，将网页的背景颜色设为#525252，网页的上边局设置为0完成！8、新闻发布网页（addnew.asp）1) 在文件面板新建一个文件addnew.asp,结果如下： 2）新建立一个1行1列的表格，宽度为770，边框0，填充0，间距0，居中对齐，单元格水平左对齐，结果如下：3）在上面的表格里面再插入一个4行3列，宽度为97%的表格，边框0，填充0，间距0，居中对齐，单元格水平左对齐，结果如下：4）将新插入的表格

12、的第1行高为5象素，第2行的第1列宽6%，第2行第2列83%，输入文字，“新闻内容录入”，字体颜色为红色，大小为24象素，字体为：Verdana, Arial, Helvetica, sans-serif，第2行第3列11%，结果如下：5）新插入的表格的第3行第2列插入一个空白表单，结果如下：6）在表单里面插入一个4行2列的表格，宽度为97%，居中对齐，结果如下：6）在刚插入的表格的第1列的第1行，第2行，第3行分别输入文字“新闻标题”、“新闻类型”、“新闻内容”，字体大小为12象素，字体为Verdana, Helvetica, sans-serif，结果如下：7）在上面的表格的第1行第2列插

13、入一个文本框，文本框属性设置如下： 结果如下：8）在上面表格的第2行第2列点菜单栏的“”插入一个列表菜单，菜单属性如下：9）点属性面板的“列表值”，弹出窗口，10）进行设置后，结果如下，点“确定”11）将文件夹拷贝到根目录文件夹下面，12）光标移动到第3行第2列，进入代码视图，将下面的代码复制到里面，结果如下： 结果代码视图如下：结果如下：12）光标在上面表格的第4行第2列点菜单拦的，属性设置如下：结果如下：9、后台编辑新闻页面（editor.asp）将addnew.asp网页另存为editor.asp,网页完成编辑。10、录入结果页面（result.asp）1) 在文件面板新建一个文件res

14、ult.asp,结果如下： 2）新建立一个1行1列的表格，宽度为770，边框0，填充0，间距0，居中对齐，单元格水平左对齐，结果如下：3）在上面的表格里面再插入一个4行3列，宽度为97%的表格，边框0，填充0，间距0，居中对齐，单元格水平左对齐，结果如下：4）将新插入的表格的第1行高为5象素，第2行的第1列宽6%，第2行第2列83%，输入文字，“新闻内容录入”，字体颜色为#0000FF，大小为16象素，字体为：Verdana, Arial, Helvetica, sans-serif，第2行第3列11%，结果如下：5) 将新插入的表格的第3行的第2列输入文字，“新闻录入成功”，字体颜色为#00

15、00FF，大小为12象素，字体为：Verdana, Arial, Helvetica, sans-serif，文字左对齐，结果如下：6）然后分别如前面操作所示，导上顶部导航条文件和底部版权文件，结果如下：7）点菜单栏的“修改”页面属性，将网页的背景颜色设为#525252，网页的上边局设置为0完成！11、后台登陆网页（login.asp）1) 在文件面板新建一个文件result.asp,结果如下： 2）新建立一个1行1列的表格，宽度为770，边框0，填充0，间距0，居中对齐，单元格水平左对齐，结果如下：3）在上面的表格里面再插入一个4行3列，宽度为97%的表格，边框0，填充0，间距0，居中对齐，

16、单元格水平左对齐，结果如下：4）将新插入的表格的第1行高为5象素，第2行的第1列宽6%，第2行第2列83%，输入文字，“登陆”，文字水平居中对齐，字体颜色为#0000FF，大小为16象素，字体为：Verdana, Arial, Helvetica, sans-serif，第2行第3列11%，结果如下：5）在新插入的表格的第3行第3列插入一个空白表单，结果如下：6）在表单里面插入一个3行3列的表格，宽100%，边框0，填充6，间距1，居中对齐，结果如下：6）在刚插入的表格的第1行第1列输入文字“用户名：”，字体颜色为#000000，文字加粗，大小为12象素，字体为：Verdana, Arial,

17、 Helvetica, sans-serif，第2行第1列输入文字“密码：”，字体颜色为#000000，文字加粗，大小为12象素，字体为：Verdana, Arial, Helvetica, sans-serif，7）在刚插入的表格的第1行第2列插入一个文本框，文本框属性设置如下： 结果如下：7）在刚插入的表格的第2行第2列插入一个文本框，文本框属性设置如下：结果如下：8）适当调整表格的宽度，将刚插入的表格的第3列的第1、2行合并单元格，再插入图片，结果如下：9）点菜单栏的“”，结果如下：10）选中提交按纽，点“代码”视图，结果如下：11）将选中内容的 type=”submit”修改为“typ

18、e=”image”,再回到“设计”视图，属性面板显示如下：12）点“源文件”的“”，选择images下的login.gif,结果如下：13）然后分别如前面操作所示，导上顶部导航条文件和底部版权文件，结果如下：14）点菜单栏的“修改”页面属性，将网页的背景颜色设为#525252，网页的上边局设置为0完成！12、后台管理网页（admin.asp）1) 在文件面板新建一个文件admin.asp,结果如下： 2)打开admin.asp文件，插入一个立一个4行3列的表格，宽度为770，边框0，填充0，间距0，居中对齐，单元格水平左对齐，结果如下：3）将第2列的宽度设置为95%，结果如下：4）将第1行第2列的高度设置为5，结果如下：5）在第2行第2列输入文字，“添加新闻 查看新闻 注销登陆”，字体大小为24，颜色为红色，结果如下：6）将光标移到第3行第2列，进入代码视图，将如下代码粘贴在里面，结果如下： 设计视图结果如下：然后分别如前面操作所示，导上顶部导航条文件和底部版权文件，结果如下：7）点菜单栏的“修改”页面属性，将网页的背景颜色设为#525252，网页的上边局设置为0完成！13、后台查