GH子系统各栏窗体设计.pptxVIP

“智能医疗信息系统”课程7.3.4 GH子系统各栏窗体设计 1.左侧栏窗体Left.aspx1）链接菜单标签设计。左侧栏主要实现链接菜单的功能，因此按照如下代码添加页面标签，其中a标签的链接目标地址为后续任务待实现的窗体页面，在此先用窗体名称替代即可：div class=leftmenu a href=GH.aspx target=right挂号/a br / a href=GHCX.aspx target=right挂号查询/a br / a href=GHLBGL.aspx target=right挂号类别管理/a br / a href=KSGL.aspx target=right科室管理/a br / a href=YHGL.aspx target=right用户管理/a br //div 1.左侧栏窗体Left.aspx2）链入左侧栏窗体的背景图通用样式。由于左侧栏、右侧栏等窗体页面都需要使用相同的背景图，因此可以将设置背景图的样式代码封装成通用的样式文件main.css。添加项目文件夹wwwroot；并在文件夹中添加样式表文件main.css；在main.css样式表文件中录入设置背景图片的代码：body { background-image: url(/Image/2.jpg);}在Left.aspx窗体中录入如下代码链入main.css样式表文件：link href=wwwroot/main.css rel=stylesheet type=text/css / 1.左侧栏窗体Left.aspx3）设置a链接标签的样式。设置导航菜单的列宽，a链接标签的基础样式以及hover链接伪类选择器样式，代码如下：4）测试Left.aspx窗体页面效果。 style type=text/css .leftmenu { width: 150px; } .leftmenu a:active, .leftmenu a:visited, .leftmenu a:link { display: block; text-decoration: none; margin: 6px 10px 6px 0px; padding: 6px 6px 6px 6px; color: #00527f; background-color: #d9e8f3; border: 1px solid #dcddc0; } .leftmenu a:hover { color: white; background-color: #8cbbda; } /style 2.右侧栏多窗体1）添加各功能窗体页面。左侧栏导航菜单单击后即可在右侧栏进入相应的业务处理或系统维护等功能窗体，因此，需要分别添加相应的Web页面窗体，并设置窗体名称如：GH，GHCX，GHLBGL，KSGL，YHGL。 2.右侧栏多窗体2）分别链入背景图通用样式。在上述新添加的右侧栏窗体中，分别录入如下代码链入main.css样式表文件。 link href=wwwroot/main.css rel=stylesheet type=text/css /3）分别设置页面测试内容。GH.aspx页面添加如下代码。同理，其它几个功能窗体也添加相应的测试代码，如GHCX.aspx添加文本内容“挂号查询页面”，GHLBGL.aspx添加文本内容“挂号类别管理页面”，KSGL.aspx添加文本内容“科室管理页面”，YHGL.aspx添加文本内容“用户管理页面”。4）测试右侧栏窗体页面效果。body form id=form1 runat=server div 挂号页面 /div /form /body 3. 首部栏窗体设计Top.aspx1）在Top.aspx窗体页面添加span标签显示登录用户信息。使用单值数据绑定以显示登录用户的用户名信息，用户名在后台从Session对象获取并存入UserName变量中，在前端页面添加%=变量名%格式的数据绑定，编写如下代码