35-魏银-实验一 网站模版和图书查询功能实现.doc

实验一 网站模版和图书查询功能实现 一、实验目的 使用模板、皮肤文件和CSS样式统一网页风格。 掌握ASP常用服务器控件的简单使用。 掌握ASP数据库编程基本思路和数据类控件的基本使用。 二、实验内容 创建网站前台模板、主题中皮肤的定义与使用。 实现图书的分类查询和书名查询。 实现最新上架图书显示。 实现图书详情浏览页面。 三、实验步骤 1.①网页整体布局和模板设置： 在【我的电脑】D盘中新建一个文件夹，命名为myshop。打开Microsoft Visual Studio软件，选择“文件”“打开”“网站”，找到并打开myshop文件夹。如图： 右击“c：\my\shop\”--“添加新项”，新建一个模板页，如图： 打开模板页，选择“工具箱”，选择HTML中的控件，拖入模板页中，默认为一个三行三列的表格，将其修改为一个5行3列宽759像素的表格。第二行设置为1行13列的表格，更具素材大小设置好高度和宽度，并拖入6个超链接控件；第三行中拖入三个控件、、。然后根据素材的大小，设置好基本的网页布局，并拖入一个可编辑区的控件，如图： ②样式表设置：A.创建样式规则 新建一个样式表，如图： 打开StyleSheet.css，右击空白处，选择“添加样式规则”，如图： 此处创建类名为tdbg、lanmubg、tdbk三个新样式规则。然后右击这三个规则中的空白处， 选择“生成样式”，然后在弹出的对话框中根据需求进行设置。如图： 设置完成： 效果如图： 再次右击空白处，添加三个新样式规则A：link、A：visited、A：hover，如图： 然后右击这三个规则中的空白处，选择“生成样式”，然后在弹出的对话框中根据需求进行设置。如图: 设置完成： B：应用样式： 点击要应用的表格属性，选择“Class”属性，输入要应用的样式，如图： ③新建一个外观文件，命名为colorful；如图： 选择第三行里的这三个控件，在属性里进行相应的设置，将生成的代码从源里面粘贴到SkinFile.skin中，删除相应的ID，如图： 应用皮肤：打开Web.Config文件，在system.web标记中添加如下代码，如图： 效果如图： 以上成功建立好模板页，新建一个Default.aspx，套用模板，如图： 在首页中连接皮肤，代码如下： %@ Page Language=C# MasterPageFile=~/MasterPage1.master AutoEventWireup=true CodeFile=Default.aspx.cs Inherits=_Default Title=Untitled Page theme=colorful % 在文件夹myshop中新建App_Data文件夹；打开数据库软件，新建NetBook数据库，导入数据，修改参数类型，设置数据库密码。在模板中加入数据库控件，如图： 点击智能按钮，配置数据源，如图： 第一次配置数据源要选择“新建数据连接”，如图： 为控件选择数据源，如图： 为DataList控件选择数据源，如图： 编辑模板，如图： 设置好后，结束模板。如图： 在首页编辑区域，放入一个宽559的2行2列的表格，为单元格设置属性，然后放入控件，如图： 配置数据源： 配置完数据源，选择数据源，出现数据，根据需要留下要显示的数据。编辑模板，在模板中放入3行2列的表格，如图： 第一行中拖入“标准”里的控件，进行绑定： 设置价格属性： 在中，输入代码： 首页设置完成，如图: ①分类查询：添加一个新项，leibook.aspx，套用模板，(复制首页中的Table)如图： 在可编辑区域放入连接数据库控件和GridView控件，配置数据源，如图： 为GridView控件选择数据源，启用分页排序，套用格式，编辑列： 编辑模板，选择空模板，设置： 效果如图： 整个分类查询完成，如图： ②书名查询：添加新项bookselect.aspx，套用模板(复制首页中的Table)。双击模板“搜索”按钮，书写代码： 为bookselect.aspx中数据库配置数据： 然后选择数据源： 书名查询完成，如图： 打开首页，配置数据源，如图： 最新上架设置完成，如图： 添加新项bookDetails.aspx，套用模板，(复制首页中的Table)。 在首页中添加代码： a href=bookdetails.aspx?BID=%# Eval(bookID) %asp:Image ID=Image1 runat=serv