一个简单的asp.net动态网站——悠本美术_简单的动态网站首页-CSDN博客

本文链接：https://blog.csdn.net/Silvia_of_Arslan/article/details/104461129

动态网站——悠本美术
在vs上写的一个简单的动态网站，借用了悠本美术的信息。

新建网站
共有三个页面：
main.aspx
introduce.aspx
show.aspx
主页面
main.aspx

我把css样式直接嵌入了aspx页面

main.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="main.aspx.cs" Inherits="main" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>悠本美术</title>
<!--<link rel="stylesheet" type="text/css" href="1.css" />-->
<style>
*{
	box-sizing:border-box;
}

body{
	font-family:Arial;
	padding:10px;
	background:#FFC;
}

img{
	width:100%;
	height:auto;
}

/*头部样式*/
.header{
	background-color:#FFC;
	padding:10px;
	text-align:center;
}

/*导航条*/
.topnav{
	overflow:hidden;
	background-color:#6C6;
}

/*导航链接*/
.topnav a{
	float:left;
	display:block;
	color:#FFF;
	text-align:center;
	padding:14px 16px;
	text-decoration:none;
}

.topnav_right
{
    float:right;
}

/*链接-修改颜色*/
.topnav a:hover{
	background-color:#6C6;
	color:#CF9;
}

/*列*/
.leftcolumn{
	float:left;
	width:75%;
}

.logo{
	width:30%;
	height:auto;	
}

.rightcolumn{
	float:left;
	width:25%;
	background-color:#FFC;
	padding-left:20px;
}

.imgone{
	width:75%;
	height:auto;	
}

/*卡片部分*/
.card{
	background-color:white;
	padding:20px;
	margin-top:20px;
}

.card h1{
    color:#6C6;
}

/*列后清除浮动*/
.row:after{
	content:"";
	display:table;
	clear:both;
}

/*底部*/
.footer{
	padding:10px;
	text-align:center;
	background-color:#6C6;
	margin-top:10px;
}

/*响应式布局-屏幕尺寸小于800px，两侧布局改为上下布局*/
@media screen and(max-width:800px){
	.leftcolumn,.rightcolumn{
		width:100%;
		padding:0;
	}
}

/*响应式布局-屏幕尺寸小于400px，导航改为上下布局*/
@media screen and(max-width:400px){
	.topnav a{
		float:none;
		width:100%;
	}
}

</style>
</head>
<body>
    <form id="form1" runat="server">
	<div class="header">
    <img src="images/yb1.jpg" />
    </div>
    <div class="topnav"> 
        <a href="main.aspx">首页</a>
        <a href="introduce.aspx">介绍</a>
        <a href="show.aspx">展示</a>
        <div class="topnav_right">
        姓名：<asp:TextBox ID="Name" runat="server" />
        
        <asp:Button ID = "submit" OnClick="Submit" runat="server" Text="确定" />
        </div>
     </div>
        
    <div class="row">
   	 <div class="leftcolumn">
	 	<div class="card">
        <div class="logo">
         <img src="images/yb2.jpg" />
         </div>
       	 <hr/> 
       	 <h1><asp:Label ID="Mess" runat="server" /></h1>
         <h1>欢迎来到悠本美术！</h1>
         
         <h2>精品课程——给您更好的选择</h2>
         <p>选对班级，选对课程，提升成绩事半功倍，为您量身定制专属于您的美术课程</p>
         <asp:GridView ID = "GridView1" runat="server"></asp:GridView> 
       	 
       	 <br/>
         用户名称：
         <br />
         <asp:TextBox ID = "txtName" runat = "server"></asp:TextBox>
         <br />
         联系方式：
         <br />
         <asp:TextBox ID = "txtTel" runat="server"></asp:TextBox>
         <br />
         您的选择：
         <br />
         <asp:TextBox ID="txtCho" runat="server"></asp:TextBox>
         <br />
         <asp:Button ID = "Button1" OnClick="Button1_Click" runat="server" Text="提交" />
         <asp:Button ID="Button2" OnClick="reset" Text="重置" runat="server" />
         <br />
         <asp:Label ID="Label1" runat="server"></asp:Label>

       	 <hr />
         当前时间：
         <%#DateTime.Now %><br />
		 </div>
      </div>
	  
	  <div class="rightcolumn">
	  	<div class="card">
        	  	
        <img src="images/yb0.jpg" />

        <hr />
        <div class="imgone">	  	
        <img src="images/ewm.jpg" />
        </div>        
        </div>
	  </div>
   	</div>
    
    <div class="footer">
    	<p>关于悠本|常州市钟楼区西横街43号（市二中，西横街小学对面）</p>
    </div>
    </form>     
</body>
</html>

后台的代码

main.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;

public partial class main : System.Web.UI.Page
{
    protected void Submit(object sender, EventArgs e)
    {
        Mess.Text = "亲爱的" + Name.Text;
    }
    protected void Page_Load(object sender, EventArgs e)
    {
        this.DataBind();//实现数据绑定
        string connstr = @"Data Source = DESKTOP-KBSKQOS\SQLEXPRESS;Initial Catalog = model;Trusted_Connection = True";
        SqlConnection conn = new SqlConnection(connstr);//所有事件外声明，让mycon和conn在所有事件中都可用
        SqlCommand cmd = new SqlCommand();
        cmd.Connection = conn;
        cmd.CommandText = "select * from ybclass";
        try
        {
            conn.Open();
            SqlDataReader dr = cmd.ExecuteReader();
            GridView1.DataSource = dr;//定义GridView控件的数据源
            GridView1.DataBind();//实现数据绑定
            dr.Close();
        }
        catch { }
        finally { conn.Close(); }
    }


    protected void Button1_Click(object sender, EventArgs e)
    {
        string connstr = @"Data Source = DESKTOP-KBSKQOS\SQLEXPRESS;Initial Catalog = model;Trusted_Connection = True";
        SqlConnection conn = new SqlConnection(connstr);//所有事件外声明，让mycon和conn在所有事件中都可用
        conn.Open();

        SqlCommand cmd = new SqlCommand();
        cmd.Connection = conn;
        try
        {
            cmd.CommandText = "insert into [choose](name,tel,choice) values ('" + txtName.Text + "','" + txtTel.Text + "',+'" + txtCho.Text + "')";
            int num = cmd.ExecuteNonQuery();
            if (num > 0)
            {
                Label1.Text = "提交成功！";
            }
        }
        catch { }
        finally
        {
            conn.Close();
        }

    }

    protected void reset(object sender, EventArgs e)
    {
        this.txtName.Text = "";
        this.txtTel.Text = "";
        this.txtCho.Text = "";
    }
    
}