【Asp.net入门09】第一个Asp.net应用程序-创建窗体并设置其样式

本节内容:

  • 添加一个aspx窗体并设计窗体内容
  • 为aspx窗体添加样式

前面我们为PartyInvites应用程序项目添加了两个c#文件:GuestResponse.cs和ResponseRepository.cs文件。这两个文件里面的代码一个是用来描述数据的GuestResponse类,一个是用来进行数据读写的ResponseRepository类。这两个类都不是用户直接访问的页面。下面我们就要开始设计一个与用户交互的页面,也就是我们通常所理解的网页。

我们接下来的任务是创建创建一个包含晚会信息,以及允许嘉宾做出回复的页面。

打开我们之前为PartyInvites项目添加的Default.aspx页面文件。按如下代码清代修改代码:

代码清单1-6 创建窗体

示例更改了form元素的id特性值,并增加了一些标准的HTML元素,以显示晚会的相关信息并从用户处收集回复信息。整个页面代码除了第一行与我们熟悉的html页面内容不一样之外,其它部分都一样。

从调试(Debug)菜单中选择启动调试(Start Debugging),或单击工具栏中的Internet Explorer按钮,启动应用程序,即可看到更改后的应用程序。如图1-7所示,我们创建了一个窗体,但它并不美观。

为Web窗体中的元素设置样式的方法与为常规HTML页面设置样式的方法相同——使用CSS(级联样式表)。要为应用程序添加一些基本的样式,在Solution Explorer中右键单击PartyInvites项,然后从弹出式菜单中选择Add→Style Sheet(样式表)。将名称设置为PartyStyles,然后单击OK按钮。Visual Studio将在项目中添加一个新的PartyStyles.css文件。设置这个新文件的内容,使其与代码清单1-7中的CSS相一致。虽然这些是非常基本的CSS样式,但它们能够美化窗体字段。

代码清单1-7 在PartyStyles.css文件中定义的CSS样式

使用link元素将CSS样式与Web窗体关联。在Default.aspx文件的head部分添加一个link元素,如代码清单1-8所示。

注意,示例使用标准的HTML元素链接包含标准CSS样式的文件。启动应用程序后,即可看到使用CSS的效果,如图1-8所示。

时间: 2024-11-05 13:27:29

【Asp.net入门09】第一个Asp.net应用程序-创建窗体并设置其样式的相关文章

《Go语言入门》第一个Go语言Web程序——简单的Web服务器

概述 上一篇讲了 <Go语言入门>第一个Go语言程序--HelloWorld,接下来讲一下Go语言Web开发入门必修课:第一个Go语言Web程序--简单的Web服务器. 与其它Web后端语言不同,Go语言需要自己编写Web服务器. 有关本地环境的搭建与基础学习,请参考: <Go语言入门>如何在Windows下安装Go语言编程环境 Go语言Web应用:IBM的云平台Bluemix使用初体验--创建Go语言 Web 应用程序,添加并使用语言翻译服务 Web服务器代码 Google在ht

Servlet入门(第一个Servlet的Web程序)

新建maven项目,注意项目的类型 工程名为ServletExample 点击Finish,建立maven项目完成如下 生成后的目录没有java源码目录,按照maven的约定,还要新建src/main/java的源码目录.选中项目,点击鼠标右键 不知道为什么,新建src/main/java目录时,eclipse报这个目录已经存在.没办法,先建立src/main/java2,然后再重构为src/main/java 配置maven的构建文件pom.xml <?xml version="1.0&

[Asp.net入门07】第一个ASP.NET 应用程序-创建数据模型和存储库

1.理解概念 先理解一下两个概念. 模型 模型是指数据的结构类型,以及可调用的方法.对面向对象编程方法来说,其实就是类.模型类就是一个描述数据的类.只有把数据按一定方式描述出来,我们才能在程序中方便地使用它. 存储库 直白解释就是存储数据的仓库.通常就是用数据库来存储数据,当然也有文件存储等其他存储方式.存储库的作用很显然是将数据永久保存起来. 2.创建数据模型 我们在[Asp.net入门06]第一个ASP.NET 应用程序(4)-案例说明中定义的案例项目比较简单,只需要一个简单的数据模型.下面

ASP.NET Core 入门教程 1、使用ASP.NET Core 构建第一个Web应用

原文:ASP.NET Core 入门教程 1.使用ASP.NET Core 构建第一个Web应用 一.前言 1.本文主要内容 Visual Studio Code 开发环境配置 使用 ASP.NET Core 构建Web应用 ASP.NET Core Web 应用启动类说明 ASP.NET Core Web 项目结构说明 2.本教程环境信息 软件/环境 说明 操作系统 Windows 10 SDK 2.1.401 ASP.NET Core 2.1.3 IDE Visual Studio Code

Asp.net入门-第一个ASP.NET 应用程序(2)

添加Web窗体 本部分内容: 什么是web form 怎样添加web form 1.添加Web窗体到项目中 Web 窗体是一项 ASP.NET 功能,您可以使用它为 Web 应用程序创建用户界面.Web 窗体页为您提供了一种强大而直接的编程模型,该模型使用您熟悉的快速应用程序开发 (RAD) 技术来生成基于 Web 的复杂用户界面. 对于初学者来说,只需要知道通过添加新的Web窗体项来为Web应用程序添加内容就足够了. 在项目"PartyInvites"上(注意不是PartyInvit

【Asp.net入门11】第一个ASP.NET 应用程序-处理窗体(2)

检查IsPostBack属性,可以确定响应的请求是否为发回到服务器的窗体.如果是,则创建GuestResponse数据模型对象的一个新实例,并将此实例传递给TryUpdateModel方法(该方法继承自基本的Page类,也就TryUpdateModel是Default类的父类Page类里的一个成员方法.) TryUpdateModel方法将执行一个称为模型绑定(model binding)的过程,在此过程中,将使用来自浏览器请求的数据值填充数据模型对象的属性.TryUpdateModel方法的另

【Asp.net入门12】第一个ASP.NET 应用程序-创建摘要视图

目前已经完成了应用程序的基本结构单元,受邀者也能够做出回复.这一节将添加一个支持组件,以显示收到的回复摘要,以便用户的朋友了解谁会参加晚会,并做出适当安排.在Solution Explorer中右键单击PartyInvites项,然后从弹出菜单中选择Add→Web Form.将名称设置为Summary,然后单击OK按钮,新创建一个文件Summary.aspx,这个新文件的内容如代码清单1-14所示. 代码清单1-14 Summary.aspx文件的内容 这是你的第一个ASP.NET应用程序,我们

【Asp.net入门15】第一个Asp.net应用程序-输入验证

前言 所谓输入验证,顾名思义就是验证用户输入符不符合要求.前面我们已经完成了这个简单的应用程序,但还有一个问题需要解决:用户可以在Default.aspx窗体中 提交任何数据,甚至可以提交根本不包含任何数据的窗体.我们需要确保用户填写了所有窗体字段, 以便收集所有相关数据,知道谁会参加晚会,谁拒绝参加晚会.下面的内容就是教你如何实现这个验证过程. 主要内容 客户端验证和服务器端验证的概念 数据注解用法 操作和分析 ASP.NET提供了各种不同的验证方法,最常用的方法是对数据模型类应用特性来实现验

[渣译文] 使用 MVC 5 的 EF6 Code First 入门 系列:为ASP.NET MVC应用程序读取相关数据

这是微软官方教程Getting Started with Entity Framework 6 Code First using MVC 5 系列的翻译,这里是第六篇:为ASP.NET MVC应用程序读取相关数据 原文:Reading Related Data with the Entity Framework in an ASP.NET MVC Application 译文版权所有,谢绝全文转载--但您可以在您的网站上添加到该教程的链接. 在之前的教程中您已经完成了学校数据模型.在本教程中你将