一、引言
刚刚学习接触ASP.NET的开发，为了熟悉vs的环境，练习之前学的bootsrap 的使用，制作了简单的登录页面。过于简单，不喜勿喷哈，具体的样子如图所示。
当登录成功时:
当登录失败时:
二、实现
其实具体的实现过程还是比较容易的，首先需要在项目中导入，bootstrap的相关包：
然后新建一个.aspx的登录页面写入
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="Login.Login" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>登录页面</title>
<script src="js/bootstrap.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row" >
<h1 class="text-center">登录页面</h1>
</div>
<hr />
<div class="row" >
<form class="form-horizontal" runat="server" role="form">
<div class="form-group">
<label for="username" class="col-sm-2 col-sm-offset-2 control-label">用户名:</label>
<div class="col-sm-5">
<asp:TextBox ID="Username" runat="server" CssClass="form-control" placeholder="请输入用户名"></asp:TextBox>
</div>
</div>
<div class="form-group">
<label for="password" class="col-sm-2 col-sm-offset-2 control-label">密码:</label>
<div class="col-sm-5">
<asp:TextBox ID="Password" type="password" runat="server" CssClass="form-control" placeholder="请输入密码"></asp:TextBox>
</div>
</div>
<asp:Button ID="Submit" runat="server" CssClass="btn btn-default btn-lg col-sm-offset-3 col-sm-6" Text="登录" OnClick="Button_Login" />
</form>
</div>
<div class="row">
<asp:Label ID="hint" runat="server" Text="" Font-Size="21px" CssClass="col-sm-12 text-center text-success"></asp:Label>
</div>
</div>
</body>
</html>
再打开其中.cs的页面，这里写
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Login
{
public partial class Login : System.Web.UI.Page
{
//提前设置的用户名
private String user_name = "admin";
//提前设置的用户密码
private String user_password = "12345";
protected void Page_Load(object sender, EventArgs e)
{
}
/**
*
* 登录提交按钮逻辑
*
* */
protected void Button_Login(object sender, EventArgs e)
{
if (Username.Text == user_name &&
Password.Text == user_password)
{
hint.Text = "登录成功，欢迎" + user_name + "用户！";
hint.ForeColor = System.Drawing.Color.Green;
}
else
{
hint.Text = "登录失败！";
hint.ForeColor = System.Drawing.Color.Red;
}
}
}
}
这样一个简单的登录页面就完成了
资源文件在:http://download.csdn.net/download/dhywjx/10278998