ASP.NET 新闻发布网站

目录

一、实现

1、数据库NewsDatabase

(1)数据表NewsInfo

(2)数据表Newsuser

2、数据库配置代码

3、css初始化文件Normalize.css

4、公共的css样式base.css

5、首页

(1) Web窗体Default.aspx

(2)css样式index.css

扫描二维码关注公众号,回复: 15508359 查看本文章

6、新闻详情页面

(1)WeB窗体NewsData.apsx

(2)css样式data.css

7、新闻列表界面

(1)Web窗体NewsList.aspx

 (2)css样式list.css

8、发布新闻界面

 (1)Web窗体AddNews.aspx

(2)AddNews.aspx.cs

(3)SqlHelper类

(4)NewsManager类

(5)css样式add.css

9、登录界面

(1)Web窗体Login.aspx

(2)Login.aspx.cs

 (3)css样式users

10、注册界面

(1)Web窗体Register.aspx

(2)Register.aspx.cs

(3)css样式users.css

11、管理新闻界面

(1)Web窗体Edit.aspx

 (2)css样式edit.css

12、站长页面

(1) Web窗体Stationmaster.aspx

(2)css样式master.css

总结


开发平台:vs2022及SSMS

一、实现

1、数据库NewsDatabase

(1)数据表NewsInfo

CREATE TABLE [dbo].[NewsInfo] (
    [NewsID]       INT             IDENTITY (1, 1) NOT NULL,
    [NewsTitle]    NVARCHAR (500)  NULL,
    [NewsData]     NVARCHAR (1000) NULL,
    [NewsDate]     DATETIME        NULL,
    [NewsImageUrl] NVARCHAR (50)   NULL,
    [NewsCategory] NVARCHAR (20)   NULL,
    PRIMARY KEY CLUSTERED ([NewsID] ASC)
);

(2)数据表Newsuser

CREATE TABLE [dbo].[Newsuser] (
    [UserID]       NVARCHAR (50) NOT NULL,
    [UserPassword] NVARCHAR (50) NULL,
    [UserName]     NVARCHAR (50) NULL,
    PRIMARY KEY CLUSTERED ([UserID] ASC)
);

2、数据库配置代码

放在Web.config下

<connectionStrings>
		<add name="NewsConnectionString"
			 connectionString="Data Source=(LocalDB)\MSSQLLocalDB; AttachDbFilename=|DataDirectory|\NewsDatabase.mdf; Integrated Security=True"
			 providerName="System.Data.SqlClient" />
	</connectionStrings>

3、css初始化文件Normalize.css

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

 html {
    line-height: 1.15; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
  }
  
  /* Sections
     ========================================================================== */
  
  /**
   * Remove the margin in all browsers.
   */
  
  body {
    margin: 0;
  }
  
  /**
   * Render the `main` element consistently in IE.
   */
  
  main {
    display: block;
  }
  
  /**
   * Correct the font size and margin on `h1` elements within `section` and
   * `article` contexts in Chrome, Firefox, and Safari.
   */
  
  h1 {
    font-size: 2em;
    margin: 0.67em 0;
  }
  
  /* Grouping content
     ========================================================================== */
  
  /**
   * 1. Add the correct box sizing in Firefox.
   * 2. Show the overflow in Edge and IE.
   */
  
  hr {
    box-sizing: content-box; /* 1 */
    height: 0; /* 1 */
    overflow: visible; /* 2 */
  }
  
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  
  pre {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  
  /* Text-level semantics
     ========================================================================== */
  
  /**
   * Remove the gray background on active links in IE 10.
   */
  
  a {
    background-color: transparent;
  }
  
  /**
   * 1. Remove the bottom border in Chrome 57-
   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
   */
  
  abbr[title] {
    border-bottom: none; /* 1 */
    text-decoration: underline; /* 2 */
    text-decoration: underline dotted; /* 2 */
  }
  
  /**
   * Add the correct font weight in Chrome, Edge, and Safari.
   */
  
  b,
  strong {
    font-weight: bolder;
  }
  
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  
  code,
  kbd,
  samp {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  
  /**
   * Add the correct font size in all browsers.
   */
  
  small {
    font-size: 80%;
  }
  
  /**
   * Prevent `sub` and `sup` elements from affecting the line height in
   * all browsers.
   */
  
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  
  sub {
    bottom: -0.25em;
  }
  
  sup {
    top: -0.5em;
  }
  
  /* Embedded content
     ========================================================================== */
  
  /**
   * Remove the border on images inside links in IE 10.
   */
  
  img {
    border-style: none;
  }
  
  /* Forms
     ========================================================================== */
  
  /**
   * 1. Change the font styles in all browsers.
   * 2. Remove the margin in Firefox and Safari.
   */
  
  button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 1 */
    line-height: 1.15; /* 1 */
    margin: 0; /* 2 */
  }
  
  /**
   * Show the overflow in IE.
   * 1. Show the overflow in Edge.
   */
  
  button,
  input { /* 1 */
    overflow: visible;
  }
  
  /**
   * Remove the inheritance of text transform in Edge, Firefox, and IE.
   * 1. Remove the inheritance of text transform in Firefox.
   */
  
  button,
  select { /* 1 */
    text-transform: none;
  }
  
  /**
   * Correct the inability to style clickable types in iOS and Safari.
   */
  
  button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
    -webkit-appearance: button;
  }
  
  /**
   * Remove the inner border and padding in Firefox.
   */
  
  button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }
  
  /**
   * Restore the focus styles unset by the previous rule.
   */
  
  button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
  }
  
  /**
   * Correct the padding in Firefox.
   */
  
  fieldset {
    padding: 0.35em 0.75em 0.625em;
  }
  
  /**
   * 1. Correct the text wrapping in Edge and IE.
   * 2. Correct the color inheritance from `fieldset` elements in IE.
   * 3. Remove the padding so developers are not caught out when they zero out
   *    `fieldset` elements in all browsers.
   */
  
  legend {
    box-sizing: border-box; /* 1 */
    color: inherit; /* 2 */
    display: table; /* 1 */
    max-width: 100%; /* 1 */
    padding: 0; /* 3 */
    white-space: normal; /* 1 */
  }
  
  /**
   * Add the correct vertical alignment in Chrome, Firefox, and Opera.
   */
  
  progress {
    vertical-align: baseline;
  }
  
  /**
   * Remove the default vertical scrollbar in IE 10+.
   */
  
  textarea {
    overflow: auto;
  }
  
  /**
   * 1. Add the correct box sizing in IE 10.
   * 2. Remove the padding in IE 10.
   */
  
  [type="checkbox"],
  [type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
  }
  
  /**
   * Correct the cursor style of increment and decrement buttons in Chrome.
   */
  
  [type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
    height: auto;
  }
  
  /**
   * 1. Correct the odd appearance in Chrome and Safari.
   * 2. Correct the outline style in Safari.
   */
  
  [type="search"] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
  }
  
  /**
   * Remove the inner padding in Chrome and Safari on macOS.
   */
  
  [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  
  /**
   * 1. Correct the inability to style clickable types in iOS and Safari.
   * 2. Change font properties to `inherit` in Safari.
   */
  
  ::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
  }
  
  /* Interactive
     ========================================================================== */
  
  /*
   * Add the correct display in Edge, IE 10+, and Firefox.
   */
  
  details {
    display: block;
  }
  
  /*
   * Add the correct display in all browsers.
   */
  
  summary {
    display: list-item;
  }
  
  /* Misc
     ========================================================================== */
  
  /**
   * Add the correct display in IE 10+.
   */
  
  template {
    display: none;
  }
  
  /**
   * Add the correct display in IE 10.
   */
  
  [hidden] {
    display: none;
  }

4、公共的css样式base.css

.w { /* 版心的公共类 */
    width: 1190px;
    margin: 0 auto;
}
.fl { /* 左浮动的公共类 */
    float: left;
}
.fr { /* 右浮动的公共类 */
    float: right;
}

/* 清除浮动声明 */
.clearfix:before, .clearfix:after {
    display: table;
    content: "";
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}

/* 公共样式 begin */
body {
    background-color: #f6f6f6; /* 主体背景色 */
}
a {
    text-decoration: none; /* 取消下划线 */
    font-size: 14px;
    color: #d7ecf3;
}
a:hover {
    color: #093759;
}
blockquote, body, button, dd, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, hr, input, legend, li, ol, p, pre, td, textarea, th, ul {
    margin: 0;
    padding: 0;
}
input, button {
    border: 0;
    outline: none; /* 取消轮廓边框 */
}
ul {
    list-style: none;
}
@font-face { /* 声明字体 */
    font-family: 'icomoon';
    src: url('../fonts/icomoon.eot?r5tos9');
    src: url('../fonts/icomoon.eot?r5tos9#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf?r5tos9') format('truetype'), url('../fonts/icomoon.woff?r5tos9') format('woff'), url('../fonts/icomoon.svg?r5tos9#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}
/* 公共样式 end */

/* 页面头部分 begin */
.middle {
    background-color: #7c4e8d;
    height: 80px;
    margin-bottom: 100px;
}
.logo {
    box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.3);
    vertical-align: middle;
}
.navbar {
    line-height: 80px;
}
.navbar li {
    float: left;
    width: 250px;
    text-align: center;
    box-sizing: border-box;
}
.nav a span {
    font-family: icomoon;
    letter-spacing: 6px;
    font-size: 20px;
}
/* 页面头部分 end */

/* 页面底部分 begin */
.footer {
    height: 270px;
    background-color: #093759;
    margin-top: 100px;
    border-top: 1px solid #000;
    box-sizing: border-box;
}
.footer-in {
    padding-top: 83px;
}
.footer h1,
.footer p,
.footer a {
    font-size: 12px;
    line-height: 35px;
    padding-right: 10px;
    color: #d7ecf3;
}
.footer h1 {
    font-weight: normal;
    font-size: 20px;
    color: #d7ecf3;
}
.footer a:hover {
    color: #7c4e8d;
}
/* 页面底部分 end */

5、首页

(1) Web窗体Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Myweb.Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>天眼Y-焦点事件速递</title>
    <!-- 网站ico -->
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
    <!-- css初始化文件 -->
    <link rel="stylesheet" href="css/Normalize.css"/>
    <!-- 公共的css样式 -->
    <link rel="stylesheet" href="css/base.css"/>
    <!-- 首页的css样式 -->
    <link rel="stylesheet" href="css/index.css" />
</head>

<body>
    <!-- 页面头部分 -->
    <div class="header" runat="server">
        <div class="w" runat="server">
            <div class="header-l fl">
                <a href="NewsData.aspx?newsid=31"><asp:Image ID="Headlines" runat="server" ImageUrl="~/images/Headlines_02.png" Height="450px"/></a>              
            </div>
            <div class="header-r fr">
                <a href="NewsData.aspx?newsid=31"><h1>今日头条</h1></a>
                <a href="NewsData.aspx?newsid=31"><p>五档!动物系人人果实尼卡形态!</p></a>
            </div>
        </div>
    </div>
    <!-- 中间头部分 -->
    <div class="middle" runat="server">
        <div class="nav clearfix w"  runat="server">
            <!-- logo部分 -->
            <div class="logo fl">
                <a href="Default.aspx">
                    <asp:Image ID="Image1" runat="server" ImageUrl="~/images/logo_03.png" />
                </a>
            </div>
            <!-- 导航栏部分 -->
            <div class="navbar fl">
                <ul>
                    <li>
                        <asp:HyperLink ID="Home" runat="server" NavigateUrl="~/Default.aspx"><span>首页</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="News" runat="server" NavigateUrl="~/Manager/AddNews.aspx"><span>发布新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Manager" runat="server" NavigateUrl="~/Manager/Login.aspx"><span>管理新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Personal" runat="server" NavigateUrl="~/Stationmaster.aspx"><span>关于站长</span></asp:HyperLink>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 中间主体部分 -->
    <div class="w major clearfix" runat="server">
        <div class="top clearfix">
            <div class="d fl">
                <asp:Label ID="Label1" runat="server" Text="时事新闻"></asp:Label>
                <div class="limit">
                    <asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
                        <ItemTemplate>
                            <div class="news_main clearfix">
                                <a href="NewsData.aspx?newsid=<%# Eval("NewsID") %>"><%# Eval("NewsTitle") %></a>
                                <asp:Label ID="NewsDateLabel1" runat="server" Text='<%# Eval("NewsDate") %>' />
                            </div>
                        </ItemTemplate>
                    </asp:Repeater>
                    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NewsConnectionString %>" SelectCommand="SELECT [NewsID], [NewsTitle], [NewsDate] FROM [NewsInfo] WHERE NewsCategory='时事新闻'"></asp:SqlDataSource>
                </div>
                <asp:HyperLink ID="HyperLink1" CssClass="more" runat="server" NavigateUrl="~/NewsList.aspx?category=时事新闻">浏览更多<i>焦点新闻>>></i></asp:HyperLink>
            </div>
            <div class="d fr">
                <asp:Label ID="Label2" runat="server" Text="娱乐新闻"></asp:Label>
                <div class="limit">
                    <asp:Repeater ID="Repeater2" runat="server" DataSourceID="SqlDataSource2">
                        <ItemTemplate>
                            <div class="news_main clearfix">
                                <a href="NewsData.aspx?newsid=<%# Eval("NewsID") %>"><%# Eval("NewsTitle") %></a>
                                <asp:Label ID="NewsDateLabel1" runat="server" Text='<%# Eval("NewsDate") %>' />
                            </div>
                        </ItemTemplate>
                    </asp:Repeater>
                    <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:NewsConnectionString %>" SelectCommand="SELECT [NewsID], [NewsTitle], [NewsDate] FROM [NewsInfo] WHERE NewsCategory='娱乐新闻' AND [NewsID] != 31"></asp:SqlDataSource>
                </div>
                <asp:HyperLink ID="HyperLink2" CssClass="more" runat="server" NavigateUrl="~/NewsList.aspx?category=娱乐新闻">浏览更多<i>焦点新闻>>></i></asp:HyperLink>
            </div>
        </div>
        <div class="bottom clearfix">
            <div class="d fl">
                <asp:Label ID="Label3" runat="server" Text="财经新闻"></asp:Label>
                <div class="limit">
                    <asp:Repeater ID="Repeater3" runat="server" DataSourceID="SqlDataSource3">
                        <ItemTemplate>
                            <div class="news_main clearfix">
                                <a href="NewsData.aspx?newsid=<%# Eval("NewsID") %>"><%# Eval("NewsTitle") %></a>
                                <asp:Label ID="NewsDateLabel1" runat="server" Text='<%# Eval("NewsDate") %>' />
                            </div>
                        </ItemTemplate>
                    </asp:Repeater>
                </div>
                <asp:SqlDataSource ID="SqlDataSource3" runat="server" ConnectionString="<%$ ConnectionStrings:NewsConnectionString %>" SelectCommand="SELECT [NewsID], [NewsTitle], [NewsDate] FROM [NewsInfo] WHERE NewsCategory='财经新闻'"></asp:SqlDataSource>
                <asp:HyperLink ID="HyperLink3" CssClass="more" runat="server" NavigateUrl="~/NewsList.aspx?category=财经新闻">浏览更多<i>焦点新闻>>></i></asp:HyperLink>
            </div>
            <div class="d fr">
                <asp:Label ID="Label4" runat="server" Text="体育新闻"></asp:Label>
                <div class="limit">
                    <asp:Repeater ID="Repeater4" runat="server" DataSourceID="SqlDataSource4">
                        <ItemTemplate>
                            <div class="news_main clearfix">
                                <a href="NewsData.aspx?newsid=<%# Eval("NewsID") %>"><%# Eval("NewsTitle") %></a>
                                <asp:Label ID="NewsDateLabel1" runat="server" Text='<%# Eval("NewsDate") %>' />
                            </div>
                        </ItemTemplate>
                    </asp:Repeater>
                </div>
                <asp:SqlDataSource ID="SqlDataSource4" runat="server" ConnectionString="<%$ ConnectionStrings:NewsConnectionString %>" SelectCommand="SELECT [NewsID], [NewsTitle], [NewsDate] FROM [NewsInfo] WHERE NewsCategory='体育新闻'"></asp:SqlDataSource>
                <asp:HyperLink ID="HyperLink4" CssClass="more" runat="server" NavigateUrl="~/NewsList.aspx?category=体育新闻">浏览更多<i>焦点新闻>>></i></asp:HyperLink>
            </div>
        </div>
    </div>
    <!-- 页面底部分 -->
    <div class="footer" runat="server">
        <div class="footer-in w">
            <h1>其他网站</h1>
            <p class="othernet">
                <a href="https://cn.bing.com/?scope=web&FORM=ANNTH1">必应</a>
                <a href="https://www.baidu.com/?tn=02003390_30_hao_pghttps://www.baidu.com/?tn=02003390_30_hao_pg">百度</a>
                <a href="https://vip.iqiyi.com/cps_pc.html">爱奇艺</a>
                <a href="https://www.mgtv.com/">芒果TV</a>
                <a href="https://www.suning.com/?utm_source=union&utm_medium=005007&adtype=5&utm_campaign=05946b19-7c4f-4443-b244-f1e37a23abbc&union_place=un">苏宁易购</a>
                <a href="https://www.msn.cn/zh-cn/lifestyle/shopping?ocid=msedgntp&cvid=2106713fc5ba43e29da7323af979881d">精选购物</a>
                <a href="https://tv.cctv.com/">CCTV</a>
                <a href="https://pages.tmall.com/wow/z/cs/act/wupr?wh_biz=tm&wh_pid=act%2Ftaokechengjie&ali_trackid=2:mm_1183900030_1813100136_110592400466:1652539528_078_1000156018&union_lens=lensId:OPT@1605248376@0bba6580_e459_175c0425fa9_4681@01;eventPageId:1586925572118;recoveryid:1652539528_078_1000156018&bxsign=tbkD7h3X8wzgVRh1OTmdJZONQCOsFcXMK1ccdlt6zI5/OzI77FFr0azst/1Dh91W9umglfxBkG+fu+pJknlCvwB8gGczvtxhl1LCeN9MnxGBpg=">天猫</a>
                <a href="https://www.taobao.com/">淘宝</a>
                <a href="https://www.jd.com/?cu=true&utm_source=c.mktdatatech.com&utm_medium=tuiguang&utm_campaign=t_16282_172613369&utm_term=b44015abbfe64f178dd3285a545224b2">京东</a>
                <a href="https://ms.vipstatic.com/union/deeplink/deeplink.html?link_url=vipshop%3A%2F%2FgoHome%3Ftra_from%3Dtra%3AC01V0000kve7p4us%3A%40_%401652539633245%3Amig_code%3A224842_168_0_QW5haGVpbVJNLXdlaXBpbmh1aQ%3D%3D_1%3A23939a8d04024296b4735f9ae37b39b9&dest_url=http%3A%2F%2Fwww.vip.com%2F">唯品会</a>
                <a href="https://www.xiaomiyoupin.com/">小米有品</a>
                <a href="https://hd.oppo.com/act/m/2021/CPS/index.html?title=title&utm_source=duomai&utm_medium=191943086">欢太商城</a>
                <a href="http://www.people.com.cn/">人民网</a>
                <a href="http://www.xinhuanet.com/">新华网</a>
            </p>
            <p>@ 2022年YJY Inc.保留所有权利。-19物联网工程有限公司</p>
        </div>
    </div>
</body>
</html>

(2)css样式index.css

.header {
    height: 454px;
    background-color: #093759;
    border-bottom: 1px solid #000;
    box-sizing: border-box;
}
.header-l {
    width: 694px;
    box-shadow: 10px -10px 10px rgba(0, 0, 0, 0.3);
    transition: all 0.2s;
}
.header-l:hover {
    margin-top: -5px;
    box-shadow: 0 10px 5px 5px rgba(0, 0, 0, 0.2);

}
.header-r {
    margin-top: 173px;
}
.header-r h1 {
    border-bottom: 1px solid #d7ecf3;
    padding-bottom: 20px;
    text-align: center;
    color: #d7ecf3;
}
.header-r p {
    font-size: 26px;
    text-align: center;
    padding-top: 20px;
    color: #d7ecf3;
}
/* 首页头部分 end */

/* 中间主体部分 begin */
.major .d {
    width: 570px;
}
.major .d:nth-child(1) {
    padding-bottom: 80px;
}
.major .d:nth-child(2) {
    padding-bottom: 80px;
}
.major .d span:first-child {
    display: block;
    line-height: 50px;
    background-color: #7c4e8d;
    text-align: center;
    color: #d7ecf3;
    font-weight: 700;
    margin-bottom: 20px;
}
.limit {
    height: 290px;
    overflow: hidden;
}
.news_main {
    border-bottom: 1px solid #ccc;
    box-sizing: border-box;
}
ItemTemplate {
    width: 300px;
}
.major .d .news_main a,
.major .d .news_main span {
    display: block;
    font-size: 12px;
    height: 40px;
    line-height: 40px;
    color: #050505;
}
.major .d .news_main a {
    float: left;
    width: 360px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 8px;
}
.major .d .news_main span {
    float: right;
}
.more {
    width: 570px;
    display: block;
    font-size: 14px;
    height: 40px;
    line-height: 40px;
    color: #676767;
    background-color: #e3e2e2;
    text-align: center;
    letter-spacing: 1px;
    margin-top: 20px;
}
.more:hover {
    background-color: #dad8d8;
    border-radius: 4px;
}
.more i {
    color: #7ea1a6;
    font-style: normal;
}
/* 中间主体部分 end */

6、新闻详情页面

(1)WeB窗体NewsData.apsx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="NewsData.aspx.cs" Inherits="Myweb.NewsData" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>天眼Y-焦点事件速递</title>
    <!-- css初始化文件 -->
    <link rel="stylesheet" href="css/Normalize.css"/>
    <!-- 公共的css样式 -->
    <link rel="stylesheet" href="css/base.css"/>
    <!-- 新闻详情的css样式 -->
    <link rel="stylesheet" href="css/data.css"/>
</head>
<body>
    <!-- 页面头部分 -->
    <div class="middle" runat="server">
        <div class="nav clearfix w"  runat="server">
            <!-- logo部分 -->
            <div class="logo fl">
                <a href="Default.aspx">
                    <asp:Image ID="Image1" runat="server" ImageUrl="~/images/logo_03.png" />
                </a>
            </div>
            <!-- 导航栏部分 -->
            <div class="navbar fl">
                <ul>
                    <li>
                        <asp:HyperLink ID="Home" runat="server" NavigateUrl="~/Default.aspx"><span>首页</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="News" runat="server" NavigateUrl="~/Manager/AddNews.aspx"><span>发布新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Manager" runat="server" NavigateUrl="~/Manager/Login.aspx"><span>管理新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Personal" runat="server" NavigateUrl="~/Stationmaster.aspx"><span>关于站长</span></asp:HyperLink>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 中间主体部分 -->
    <div class="w clearfix" runat="server">
        <div class="news_data">
            <asp:DataList ID="DataList1" runat="server" DataKeyField="NewsID" DataSourceID="SqlDataSource1" Width="600px">
                <ItemTemplate>
                    <b><%# Eval("NewsTitle") %></b>
                    <div class="mnav clearfix">
                        <p class="fl">类别:<%# Eval("NewsCategory") %></p>
                        <p class="fr">发布时间:<%# Eval("NewsDate") %></p>
                    </div>
                    <asp:Label ID="NewsDataLabel2" runat="server" Text='<%# Eval("NewsData") %>' />
                    <br />
                    <asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("NewsImageUrl") %>' Width="900px" />
                    <br /><br /><br />
                </ItemTemplate>
            </asp:DataList>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NewsConnectionString %>" SelectCommand="SELECT * FROM [NewsInfo] WHERE ([NewsID] = @NewsID)">
                <SelectParameters>
                    <asp:QueryStringParameter Name="NewsID" QueryStringField="newsid" Type="Int32" />
                </SelectParameters>
            </asp:SqlDataSource>
        </div>
    </div>
    <!-- 页面底部分 -->
    <div class="footer" runat="server">
        <div class="footer-in w">
            <h1>其他网站</h1>
            <p class="othernet">
                <a href="https://cn.bing.com/?scope=web&FORM=ANNTH1">必应</a>
                <a href="https://www.baidu.com/?tn=02003390_30_hao_pghttps://www.baidu.com/?tn=02003390_30_hao_pg">百度</a>
                <a href="https://vip.iqiyi.com/cps_pc.html">爱奇艺</a>
                <a href="https://www.mgtv.com/">芒果TV</a>
                <a href="https://www.suning.com/?utm_source=union&utm_medium=005007&adtype=5&utm_campaign=05946b19-7c4f-4443-b244-f1e37a23abbc&union_place=un">苏宁易购</a>
                <a href="https://www.msn.cn/zh-cn/lifestyle/shopping?ocid=msedgntp&cvid=2106713fc5ba43e29da7323af979881d">精选购物</a>
                <a href="https://tv.cctv.com/">CCTV</a>
                <a href="https://pages.tmall.com/wow/z/cs/act/wupr?wh_biz=tm&wh_pid=act%2Ftaokechengjie&ali_trackid=2:mm_1183900030_1813100136_110592400466:1652539528_078_1000156018&union_lens=lensId:OPT@1605248376@0bba6580_e459_175c0425fa9_4681@01;eventPageId:1586925572118;recoveryid:1652539528_078_1000156018&bxsign=tbkD7h3X8wzgVRh1OTmdJZONQCOsFcXMK1ccdlt6zI5/OzI77FFr0azst/1Dh91W9umglfxBkG+fu+pJknlCvwB8gGczvtxhl1LCeN9MnxGBpg=">天猫</a>
                <a href="https://www.taobao.com/">淘宝</a>
                <a href="https://www.jd.com/?cu=true&utm_source=c.mktdatatech.com&utm_medium=tuiguang&utm_campaign=t_16282_172613369&utm_term=b44015abbfe64f178dd3285a545224b2">京东</a>
                <a href="https://ms.vipstatic.com/union/deeplink/deeplink.html?link_url=vipshop%3A%2F%2FgoHome%3Ftra_from%3Dtra%3AC01V0000kve7p4us%3A%40_%401652539633245%3Amig_code%3A224842_168_0_QW5haGVpbVJNLXdlaXBpbmh1aQ%3D%3D_1%3A23939a8d04024296b4735f9ae37b39b9&dest_url=http%3A%2F%2Fwww.vip.com%2F">唯品会</a>
                <a href="https://www.xiaomiyoupin.com/">小米有品</a>
                <a href="https://hd.oppo.com/act/m/2021/CPS/index.html?title=title&utm_source=duomai&utm_medium=191943086">欢太商城</a>
                <a href="http://www.people.com.cn/">人民网</a>
                <a href="http://www.xinhuanet.com/">新华网</a>
            </p>
            <p>@ 2022年YJY Inc.保留所有权利。-19物联网工程有限公司</p>
        </div>
    </div>
</body>
</html>

(2)css样式data.css

.news_data {
    margin: 0 auto;
    width: 900px;
}
.news_data b {
    display: block;
    height: 80px;
    line-height: 80px;
    text-align: center;
    font-size: 24px;
    color: #7c4e8d;
}
.news_data .mnav {
    height: 60px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    margin-bottom: 20px;
}
.news_data .mnav p {
    display: block;
    line-height: 60px;
    color: #4e4e4e;
    padding: 0 10px;
}
.news_data span {
    display: block;
    color: #4e4e4e;
    letter-spacing: 1px;
    text-indent: 2em;
    line-height: 150%;
}

7、新闻列表界面

(1)Web窗体NewsList.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="NewsList.aspx.cs" Inherits="Myweb.NewsList" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>天眼Y-焦点事件速递</title>
    <!-- css初始化文件 -->
    <link rel="stylesheet" href="css/Normalize.css"/>
    <!-- 公共的css样式 -->
    <link rel="stylesheet" href="css/base.css"/>
    <!-- 新闻列表的css样式 -->
    <link rel="stylesheet" href="css/list.css" />
</head>
<body>
    <!-- 页面头部分 -->
    <div class="middle" runat="server">
        <div class="nav clearfix w"  runat="server">
            <!-- logo部分 -->
            <div class="logo fl">
                <a href="Default.aspx">
                    <asp:Image ID="Image1" runat="server" ImageUrl="~/images/logo_03.png" />
                </a>
            </div>
            <!-- 导航栏部分 -->
            <div class="navbar fl">
                <ul>
                    <li>
                        <asp:HyperLink ID="Home" runat="server" NavigateUrl="~/Default.aspx"><span>首页</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="News" runat="server" NavigateUrl="~/Manager/AddNews.aspx"><span>发布新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Manager" runat="server" NavigateUrl="~/Manager/Login.aspx"><span>管理新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Personal" runat="server" NavigateUrl="~/Stationmaster.aspx"><span>关于站长</span></asp:HyperLink>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 中间主体部分 -->
    <div class="w clearfix"  runat="server">
        <div class="news_list">
            <asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
                <HeaderTemplate><b>新闻标题</b><b>发布时间</b><br /></HeaderTemplate>
                <ItemTemplate>
                    <div class="listdata">
                        <a href="NewsData.aspx?newsid=<%# Eval("NewsID") %>"><%# Eval("NewsTitle") %></a>
                        <asp:Label ID="NewsDateLabel" runat="server" Text='<%# Eval("NewsDate") %>' />
                    </div>
                </ItemTemplate>
                <FooterTemplate>
                    <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="~/Default.aspx">返回首页</asp:HyperLink>
                </FooterTemplate>
            </asp:Repeater>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NewsConnectionString %>" SelectCommand="SELECT [NewsID], [NewsTitle], [NewsDate] FROM [NewsInfo] WHERE ([NewsCategory] = @NewsCategory)">
                <SelectParameters>
                    <asp:QueryStringParameter Name="NewsCategory" QueryStringField="category" Type="String" />
                </SelectParameters>
            </asp:SqlDataSource>
        </div>
    </div>
    <!-- 页面底部分 -->
    <div class="footer" runat="server">
        <div class="footer-in w">
            <h1>其他网站</h1>
            <p class="othernet">
                <a href="https://cn.bing.com/?scope=web&FORM=ANNTH1">必应</a>
                <a href="https://www.baidu.com/?tn=02003390_30_hao_pghttps://www.baidu.com/?tn=02003390_30_hao_pg">百度</a>
                <a href="https://vip.iqiyi.com/cps_pc.html">爱奇艺</a>
                <a href="https://www.mgtv.com/">芒果TV</a>
                <a href="https://www.suning.com/?utm_source=union&utm_medium=005007&adtype=5&utm_campaign=05946b19-7c4f-4443-b244-f1e37a23abbc&union_place=un">苏宁易购</a>
                <a href="https://www.msn.cn/zh-cn/lifestyle/shopping?ocid=msedgntp&cvid=2106713fc5ba43e29da7323af979881d">精选购物</a>
                <a href="https://tv.cctv.com/">CCTV</a>
                <a href="https://pages.tmall.com/wow/z/cs/act/wupr?wh_biz=tm&wh_pid=act%2Ftaokechengjie&ali_trackid=2:mm_1183900030_1813100136_110592400466:1652539528_078_1000156018&union_lens=lensId:OPT@1605248376@0bba6580_e459_175c0425fa9_4681@01;eventPageId:1586925572118;recoveryid:1652539528_078_1000156018&bxsign=tbkD7h3X8wzgVRh1OTmdJZONQCOsFcXMK1ccdlt6zI5/OzI77FFr0azst/1Dh91W9umglfxBkG+fu+pJknlCvwB8gGczvtxhl1LCeN9MnxGBpg=">天猫</a>
                <a href="https://www.taobao.com/">淘宝</a>
                <a href="https://www.jd.com/?cu=true&utm_source=c.mktdatatech.com&utm_medium=tuiguang&utm_campaign=t_16282_172613369&utm_term=b44015abbfe64f178dd3285a545224b2">京东</a>
                <a href="https://ms.vipstatic.com/union/deeplink/deeplink.html?link_url=vipshop%3A%2F%2FgoHome%3Ftra_from%3Dtra%3AC01V0000kve7p4us%3A%40_%401652539633245%3Amig_code%3A224842_168_0_QW5haGVpbVJNLXdlaXBpbmh1aQ%3D%3D_1%3A23939a8d04024296b4735f9ae37b39b9&dest_url=http%3A%2F%2Fwww.vip.com%2F">唯品会</a>
                <a href="https://www.xiaomiyoupin.com/">小米有品</a>
                <a href="https://hd.oppo.com/act/m/2021/CPS/index.html?title=title&utm_source=duomai&utm_medium=191943086">欢太商城</a>
                <a href="http://www.people.com.cn/">人民网</a>
                <a href="http://www.xinhuanet.com/">新华网</a>
            </p>
            <p>@ 2022年YJY Inc.保留所有权利。-19物联网工程有限公司</p>
        </div>
    </div>
</body>
</html>

 (2)css样式list.css

.news_list {
    margin:0 auto;
    width: 900px;
}
.news_list b,
.news_list span,
.news_list a {
    float: left;
    display: block;
    height: 50px;
    line-height: 50px;
    border: 1px solid #ccc;
    box-sizing: border-box;
    text-align: center;
}
.news_list b {
    background-color: #7c4e8d;
    color: #d7ecf3;
}
.news_list b:first-child {
    width: 700px;
}
.news_list b:nth-child(2) {
    width: 200px;
}
.listdata {
    float: left;
}
.listdata:hover {
    background-color: #eee;
}
.news_list a {
    width: 700px;
    color: #050505;
    text-align: left;
    padding-left: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.news_list span {
    width: 200px;
}
#Repeater1_HyperLink1 {
    width: 900px;
    background-color: #7c4e8d;
    text-align: center;
    color: #d7ecf3;
    font-weight: 700;
}
#Repeater1_HyperLink1:hover {
    color: #093759;
}

8、发布新闻界面

 (1)Web窗体AddNews.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AddNews.aspx.cs" Inherits="Myweb.Manager.AddNews" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>天眼Y-焦点事件速递</title>
    <!-- css初始化文件 -->
    <link rel="stylesheet" href="../css/Normalize.css"/>
    <!-- 公共的css样式 -->
    <link rel="stylesheet" href="../css/base.css"/>
    <!-- 发布界面的css样式 -->
    <link rel="stylesheet" href="../css/add.css" />
</head>
<body>
    <!-- 页面头部分 -->
    <div class="middle" runat="server">
        <div class="nav clearfix w"  runat="server">
            <!-- logo部分 -->
            <div class="logo fl">
                <a href="../Default.aspx">
                    <asp:Image ID="Image1" runat="server" ImageUrl="~/images/logo_03.png" />
                </a>
            </div>
            <!-- 导航栏部分 -->
            <div class="navbar fl">
                <ul>
                    <li>
                        <asp:HyperLink ID="Home" runat="server" NavigateUrl="~/Default.aspx"><span>首页</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="News" runat="server" NavigateUrl="~/Manager/AddNews.aspx"><span>发布新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Manager" runat="server" NavigateUrl="~/Manager/Login.aspx"><span>管理新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Personal" runat="server" NavigateUrl="~/Stationmaster.aspx"><span>关于站长</span></asp:HyperLink>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 中间主体部分 -->
    <div class="w add" runat="server">
        <div class="add-in" runat="server">
            <form id="form1" runat="server">
                <div class="title">
                    <asp:TextBox ID="txttitle" runat="server" placeholder="请输入新闻标题(不能为空)"></asp:TextBox>
                </div>
                <div class="content">
                    <asp:TextBox ID="txtcontent" runat="server" TextMode="MultiLine" placeholder="请输入新闻内容(不能为空)"></asp:TextBox>
                </div>
                <div class="mageurl">
                    <asp:Label ID="Label1" runat="server" Text="图片路径:"></asp:Label>
                    <asp:TextBox ID="txtimageurl" runat="server">../images/</asp:TextBox>
                </div>
                <div class="category">
                    <asp:Label ID="Label2" runat="server" Text="新闻类别:"></asp:Label>
                        <asp:DropDownList ID="ddlcategory" runat="server">
                            <asp:ListItem>时事新闻</asp:ListItem>
                            <asp:ListItem>财经新闻</asp:ListItem>
                            <asp:ListItem>娱乐新闻</asp:ListItem>
                            <asp:ListItem>体育新闻</asp:ListItem>
                        </asp:DropDownList>
                </div>
                <div class="button clearfix">
                    <asp:Button ID="Button1" runat="server" Text="发布" OnClick="Button1_Click" />
                    <input type="reset"/>
                </div>
            </form>
        </div>
    </div> 
    <!-- 页面底部分 -->
    <div class="footer" runat="server">
        <div class="footer-in w">
            <h1>其他网站</h1>
            <p class="othernet">
                <a href="https://cn.bing.com/?scope=web&FORM=ANNTH1">必应</a>
                <a href="https://www.baidu.com/?tn=02003390_30_hao_pghttps://www.baidu.com/?tn=02003390_30_hao_pg">百度</a>
                <a href="https://vip.iqiyi.com/cps_pc.html">爱奇艺</a>
                <a href="https://www.mgtv.com/">芒果TV</a>
                <a href="https://www.suning.com/?utm_source=union&utm_medium=005007&adtype=5&utm_campaign=05946b19-7c4f-4443-b244-f1e37a23abbc&union_place=un">苏宁易购</a>
                <a href="https://www.msn.cn/zh-cn/lifestyle/shopping?ocid=msedgntp&cvid=2106713fc5ba43e29da7323af979881d">精选购物</a>
                <a href="https://tv.cctv.com/">CCTV</a>
                <a href="https://pages.tmall.com/wow/z/cs/act/wupr?wh_biz=tm&wh_pid=act%2Ftaokechengjie&ali_trackid=2:mm_1183900030_1813100136_110592400466:1652539528_078_1000156018&union_lens=lensId:OPT@1605248376@0bba6580_e459_175c0425fa9_4681@01;eventPageId:1586925572118;recoveryid:1652539528_078_1000156018&bxsign=tbkD7h3X8wzgVRh1OTmdJZONQCOsFcXMK1ccdlt6zI5/OzI77FFr0azst/1Dh91W9umglfxBkG+fu+pJknlCvwB8gGczvtxhl1LCeN9MnxGBpg=">天猫</a>
                <a href="https://www.taobao.com/">淘宝</a>
                <a href="https://www.jd.com/?cu=true&utm_source=c.mktdatatech.com&utm_medium=tuiguang&utm_campaign=t_16282_172613369&utm_term=b44015abbfe64f178dd3285a545224b2">京东</a>
                <a href="https://ms.vipstatic.com/union/deeplink/deeplink.html?link_url=vipshop%3A%2F%2FgoHome%3Ftra_from%3Dtra%3AC01V0000kve7p4us%3A%40_%401652539633245%3Amig_code%3A224842_168_0_QW5haGVpbVJNLXdlaXBpbmh1aQ%3D%3D_1%3A23939a8d04024296b4735f9ae37b39b9&dest_url=http%3A%2F%2Fwww.vip.com%2F">唯品会</a>
                <a href="https://www.xiaomiyoupin.com/">小米有品</a>
                <a href="https://hd.oppo.com/act/m/2021/CPS/index.html?title=title&utm_source=duomai&utm_medium=191943086">欢太商城</a>
                <a href="http://www.people.com.cn/">人民网</a>
                <a href="http://www.xinhuanet.com/">新华网</a>
            </p>
            <p>@ 2022年YJY Inc.保留所有权利。-19物联网工程有限公司</p>
        </div>
    </div>
</body>
</html>

(2)AddNews.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Myweb.NewsAppCode;

namespace Myweb.Manager
{
    public partial class AddNews : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            UnobtrusiveValidationMode = UnobtrusiveValidationMode.None;
        }

        protected void Button1_Click(object sender, EventArgs e)
        {
            //初始化新闻操作类
            NewsManager mynews = new NewsManager();
            //调用添加新闻的方法
            bool result = mynews.AddNews(txttitle.Text, txtcontent.Text, ddlcategory.SelectedValue, txtimageurl.Text);
            //判断添加操作的执行结果
            if (result)
                //成功后返回首页
                Response.Redirect("~/Default.aspx");
        }
    }
}

(3)SqlHelper类

using System;
using System.Collections;
using System.Collections.Generic;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Web;

namespace Myweb.NewsAppCode
{
    public class SqlHelper
    {
        //获取数据库连接字符串,其属于静态变量且只读,项目中所有文档可以直接使用,但不能修改
        public static readonly string ConnectionStringLocalTransaction = ConfigurationManager.ConnectionStrings["NewsConnectionString"].ConnectionString;
        //public static readonly string ConnectionStringInventoryDistributedTransaction = ConfigurationManager.ConnectionStrings["SQLConnString2"].ConnectionString;
        //public static readonly string ConnectionStringOrderDistributedTransaction = ConfigurationManager.ConnectionStrings["SQLConnString3"].ConnectionString;
        //public static readonly string ConnectionStringProfile = ConfigurationManager.ConnectionStrings["SQLProfileConnString"].ConnectionString;

        // 哈希表用来存储缓存的参数信息,哈希表可以存储任意类型的参数。
        private static Hashtable parmCache = Hashtable.Synchronized(new Hashtable());

        /// <summary>
        ///执行一个不需要返回值的SqlCommand命令,通过指定专用的连接字符串。
        /// 使用参数数组形式提供参数列表 
        /// </summary>
        /// <remarks>
        /// 使用示例:
        ///  int result = ExecuteNonQuery(connString, CommandType.StoredProcedure, "PublishOrders", new SqlParameter("@prodid", 24));
        /// </remarks>
        /// <param name="connectionString">一个有效的数据库连接字符串</param>
        /// <param name="commandType">SqlCommand命令类型 (存储过程, T-SQL语句, 等等。)</param>
        /// <param name="commandText">存储过程的名字或者 T-SQL 语句</param>
        /// <param name="commandParameters">以数组形式提供SqlCommand命令中用到的参数列表</param>
        /// <returns>返回一个数值表示此SqlCommand命令执行后影响的行数</returns>
        public static int ExecuteNonQuery(string connectionString, CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
        {

            SqlCommand cmd = new SqlCommand();

            using (SqlConnection conn = new SqlConnection(connectionString))
            {
                //通过PrePareCommand方法将参数逐个加入到SqlCommand的参数集合中
                PrepareCommand(cmd, conn, null, cmdType, cmdText, commandParameters);
                int val = cmd.ExecuteNonQuery();

                //清空SqlCommand中的参数列表
                cmd.Parameters.Clear();
                return val;
            }
        }

        /// <summary>
        ///执行一条不返回结果的SqlCommand,通过一个已经存在的数据库连接 
        /// 使用参数数组提供参数
        /// </summary>
        /// <remarks>
        /// 使用示例:  
        ///  int result = ExecuteNonQuery(conn, CommandType.StoredProcedure, "PublishOrders", new SqlParameter("@prodid", 24));
        /// </remarks>
        /// <param name="conn">一个现有的数据库连接</param>
        /// <param name="commandType">SqlCommand命令类型 (存储过程, T-SQL语句, 等等。)</param>
        /// <param name="commandText">存储过程的名字或者 T-SQL 语句</param>
        /// <param name="commandParameters">以数组形式提供SqlCommand命令中用到的参数列表</param>
        /// <returns>返回一个数值表示此SqlCommand命令执行后影响的行数</returns>
        public static int ExecuteNonQuery(SqlConnection connection, CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
        {

            SqlCommand cmd = new SqlCommand();

            PrepareCommand(cmd, connection, null, cmdType, cmdText, commandParameters);
            int val = cmd.ExecuteNonQuery();
            cmd.Parameters.Clear();
            return val;
        }

        /// <summary>
        /// 执行一条不返回结果的SqlCommand,通过一个已经存在的数据库事物处理 
        /// 使用参数数组提供参数
        /// </summary>
        /// <remarks>
        /// 使用示例: 
        ///  int result = ExecuteNonQuery(trans, CommandType.StoredProcedure, "PublishOrders", new SqlParameter("@prodid", 24));
        /// </remarks>
        /// <param name="trans">一个存在的 sql 事物处理</param>
        /// <param name="commandType">SqlCommand命令类型 (存储过程, T-SQL语句, 等等。)</param>
        /// <param name="commandText">存储过程的名字或者 T-SQL 语句</param>
        /// <param name="commandParameters">以数组形式提供SqlCommand命令中用到的参数列表</param>
        /// <returns>返回一个数值表示此SqlCommand命令执行后影响的行数</returns>
        public static int ExecuteNonQuery(SqlTransaction trans, CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
        {
            SqlCommand cmd = new SqlCommand();
            PrepareCommand(cmd, trans.Connection, trans, cmdType, cmdText, commandParameters);
            int val = cmd.ExecuteNonQuery();
            cmd.Parameters.Clear();
            return val;
        }

        /// <summary>
        /// 执行一条返回结果集的SqlCommand命令,通过专用的连接字符串。
        /// 使用参数数组提供参数
        /// </summary>
        /// <remarks>
        /// 使用示例:  
        ///  SqlDataReader r = ExecuteReader(connString, CommandType.StoredProcedure, "PublishOrders", new SqlParameter("@prodid", 24));
        /// </remarks>
        /// <param name="connectionString">一个有效的数据库连接字符串</param>
        /// <param name="commandType">SqlCommand命令类型 (存储过程, T-SQL语句, 等等。)</param>
        /// <param name="commandText">存储过程的名字或者 T-SQL 语句</param>
        /// <param name="commandParameters">以数组形式提供SqlCommand命令中用到的参数列表</param>
        /// <returns>返回一个包含结果的SqlDataReader</returns>
        public static SqlDataReader ExecuteReader(string connectionString, CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
        {
            SqlCommand cmd = new SqlCommand();
            SqlConnection conn = new SqlConnection(connectionString);

            // 在这里使用try/catch处理是因为如果方法出现异常,则SqlDataReader就不存在,
            //CommandBehavior.CloseConnection的语句就不会执行,触发的异常由catch捕获。
            //关闭数据库连接,并通过throw再次引发捕捉到的异常。
            try
            {
                PrepareCommand(cmd, conn, null, cmdType, cmdText, commandParameters);
                SqlDataReader rdr = cmd.ExecuteReader(CommandBehavior.CloseConnection);
                cmd.Parameters.Clear();
                return rdr;
            }
            catch
            {
                conn.Close();
                throw;
            }
        }

        /// <summary>
        /// 执行一条返回第一条记录第一列的SqlCommand命令,通过专用的连接字符串。 
        /// 使用参数数组提供参数
        /// </summary>
        /// <remarks>
        /// 使用示例:  
        ///  Object obj = ExecuteScalar(connString, CommandType.StoredProcedure, "PublishOrders", new SqlParameter("@prodid", 24));
        /// </remarks>
        /// <param name="connectionString">一个有效的数据库连接字符串</param>
        /// <param name="commandType">SqlCommand命令类型 (存储过程, T-SQL语句, 等等。)</param>
        /// <param name="commandText">存储过程的名字或者 T-SQL 语句</param>
        /// <param name="commandParameters">以数组形式提供SqlCommand命令中用到的参数列表</param>
        /// <returns>返回一个object类型的数据,可以通过 Convert.To{Type}方法转换类型</returns>
        public static object ExecuteScalar(string connectionString, CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
        {
            SqlCommand cmd = new SqlCommand();

            using (SqlConnection connection = new SqlConnection(connectionString))
            {
                PrepareCommand(cmd, connection, null, cmdType, cmdText, commandParameters);
                object val = cmd.ExecuteScalar();
                cmd.Parameters.Clear();
                return val;
            }
        }

        /// <summary>
        /// 执行一条返回第一条记录第一列的SqlCommand命令,通过已经存在的数据库连接。
        /// 使用参数数组提供参数
        /// </summary>
        /// <remarks>
        /// 使用示例: 
        ///  Object obj = ExecuteScalar(connString, CommandType.StoredProcedure, "PublishOrders", new SqlParameter("@prodid", 24));
        /// </remarks>
        /// <param name="conn">一个已经存在的数据库连接</param>
        /// <param name="commandType">SqlCommand命令类型 (存储过程, T-SQL语句, 等等。)</param>
        /// <param name="commandText">存储过程的名字或者 T-SQL 语句</param>
        /// <param name="commandParameters">以数组形式提供SqlCommand命令中用到的参数列表</param>
        /// <returns>返回一个object类型的数据,可以通过 Convert.To{Type}方法转换类型</returns>
        public static object ExecuteScalar(SqlConnection connection, CommandType cmdType, string cmdText, params SqlParameter[] commandParameters)
        {

            SqlCommand cmd = new SqlCommand();

            PrepareCommand(cmd, connection, null, cmdType, cmdText, commandParameters);
            object val = cmd.ExecuteScalar();
            cmd.Parameters.Clear();
            return val;
        }
        /// <summary>
        /// 缓存参数数组
        /// </summary>
        /// <param name="cacheKey">参数缓存的键值</param>
        /// <param name="cmdParms">被缓存的参数列表</param>
        public static void CacheParameters(string cacheKey, params SqlParameter[] commandParameters)
        {
            parmCache[cacheKey] = commandParameters;
        }

        /// <summary>
        /// 获取被缓存的参数
        /// </summary>
        /// <param name="cacheKey">用于查找参数的KEY值</param>
        /// <returns>返回缓存的参数数组</returns>
        public static SqlParameter[] GetCachedParameters(string cacheKey)
        {
            SqlParameter[] cachedParms = (SqlParameter[])parmCache[cacheKey];

            if (cachedParms == null)
                return null;

            //新建一个参数的克隆列表
            SqlParameter[] clonedParms = new SqlParameter[cachedParms.Length];

            //通过循环为克隆参数列表赋值
            for (int i = 0, j = cachedParms.Length; i < j; i++)
                //使用clone方法复制参数列表中的参数
                clonedParms[i] = (SqlParameter)((ICloneable)cachedParms[i]).Clone();

            return clonedParms;
        }

        /// <summary>
        /// 为执行命令准备参数
        /// </summary>
        /// <param name="cmd">SqlCommand 命令</param>
        /// <param name="conn">已经存在的数据库连接</param>
        /// <param name="trans">数据库事物处理</param>
        /// <param name="cmdType">SqlCommand命令类型 (存储过程, T-SQL语句, 等等。)</param>
        /// <param name="cmdText">Command text,T-SQL语句 例如 Select * from Products</param>
        /// <param name="cmdParms">返回带参数的命令</param>
        private static void PrepareCommand(SqlCommand cmd, SqlConnection conn, SqlTransaction trans, CommandType cmdType, string cmdText, SqlParameter[] cmdParms)
        {

            //判断数据库连接状态
            if (conn.State != ConnectionState.Open)
                conn.Open();

            cmd.Connection = conn;
            cmd.CommandText = cmdText;

            //判断是否需要事物处理
            if (trans != null)
                cmd.Transaction = trans;

            cmd.CommandType = cmdType;

            if (cmdParms != null)
            {
                foreach (SqlParameter parm in cmdParms)
                    cmd.Parameters.Add(parm);
            }
        }
    }
}

(4)NewsManager类

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Text;
using System.Web;

namespace Myweb.NewsAppCode
{
    public class NewsManager
    {
        //定义常量表示字段名称或SQL语句
        private const string SQL_INSERT_NEWSINFO = "INSERT INTO newsinfo VALUES(@title,@data,@date,@imageurl,@category)";
        private const string PARM_NEWS_TITLE = "@title";
        private const string PARM_NEWS_DATA = "@data";
        private const string PARM_NEWS_DATE = "@date";
        private const string PARM_NEWS_CATEGORY = "@category";
        private const string PARM_NEWS_IMAGEURL = "@imageurl";

        public NewsManager()
        { }
        /// <summary>
        /// 添加新闻
        /// </summary>
        /// <param name="newsTitle">新闻主题</param>
        /// <param name="newsData">新闻内容</param>
        /// <param name="newsCategory">新闻类别</param>
        /// <param name="imageUrl">新闻的图片链接地址</param>
        /// <returns>添加是否成功</returns>
        public bool AddNews(string newsTitle, string newsData, string newsCategory, string imageUrl)
        {
            //使用StringBuild连接字符串比使用“+”效率高得多
            StringBuilder strSQL = new StringBuilder();
            //获取缓存参数,如果没有,此方法会自动创建缓存列表
            SqlParameter[] newsParms = GetParameters();
            //创建执行语句的SQL命令
            SqlCommand cmd = new SqlCommand();
            //依次给参数赋值
            newsParms[0].Value = newsTitle;
            newsParms[1].Value = newsData;
            //注意新闻发布的日期取当日
            newsParms[2].Value = DateTime.Now;
            newsParms[3].Value = imageUrl;
            newsParms[4].Value = newsCategory;

            //遍历所有参数,并将参数添加到SqlCommand命令中
            foreach (SqlParameter parm in newsParms)
                cmd.Parameters.Add(parm);
            //获取数据库的连接字符串
            using (SqlConnection conn = new SqlConnection(SqlHelper.ConnectionStringLocalTransaction))
            {
                strSQL.Append(SQL_INSERT_NEWSINFO);
                //打开数据库连接,执行命令
                conn.Open();
                //设置Sqlcommand命令的属性
                cmd.Connection = conn;
                cmd.CommandType = CommandType.Text;
                cmd.CommandText = strSQL.ToString();
                //执行添加的SqlCommand命令
                int val = cmd.ExecuteNonQuery();
                //清空SqlCommand命令中的参数
                cmd.Parameters.Clear();
                //判断是否添加成功,注意返回的是添加是否成功,不是影响的行数
                if (val > 0)
                    return true;
                else
                    return false;
            }
        }

        /// <summary>
        /// 创建或获取缓存参数的私有方法
        /// </summary>
        /// <returns>返回参数列表</returns>
        private SqlParameter[] GetParameters()
        {
            //将SQL_INSERT_NEWSINFO作为哈希表缓存的键值
            SqlParameter[] parms = SqlHelper.GetCachedParameters(SQL_INSERT_NEWSINFO);

            //首先判断缓存是否已经存在
            if (parms == null)
            {
                //缓存不存在的情况下,新建参数列表
                parms = new SqlParameter[]
                {
                new SqlParameter(PARM_NEWS_TITLE, SqlDbType.NVarChar, 500),
                new SqlParameter(PARM_NEWS_DATA, SqlDbType.NVarChar, 1000),
                new SqlParameter(PARM_NEWS_DATE, SqlDbType.DateTime),
                new SqlParameter(PARM_NEWS_IMAGEURL, SqlDbType.NVarChar, 50),
                new SqlParameter(PARM_NEWS_CATEGORY, SqlDbType.NVarChar, 20)
                };

                //将新建的参数列表添加到哈希表中缓存起来
                SqlHelper.CacheParameters(SQL_INSERT_NEWSINFO);
            }
            //返回参数
            return parms;
        }
    }
}

(5)css样式add.css

.add-in {
    width: 816px;
    margin: 0 auto;
}
#form1 {
    min-height: 500px;
    border: 1px solid #dadce0;
    border-radius: 5px;
    background-color: #fff;
}
.title {
    padding: 32px 64px 24px;
}
#txttitle {
    display: block;
    width: 688px;
    height: 55px;
    margin: 0 auto;
    color: #606266;
    box-sizing: border-box;
    line-height: 32px;
    font-size: 23px;
    font-weight: 600;
    overflow: hidden;
    border-bottom: 1px solid #606266;
}
#txttitle::-webkit-input-placeholder {
    color: #b2b2b2;
}
.content {
    width: 816px;
    padding: 0 64px;
}
#txtcontent {
    min-height: 500px;
    min-width: 690px;
    margin: 0 auto;
    resize: none;
    border: none;
    outline: none;
    font-size: 16px;
    color: #4d4d4d;
    font-weight: normal;
    line-height: 26px;
    overflow-x: auto;
    overflow-y: hidden;
}
#txtcontent::-webkit-input-placeholder {
    color: #b2b2b2;
}
.mageurl {
    padding: 24px 64px;
    box-sizing: border-box;
}
#Label1, #Label2 {
    font-size: 14px;
    color: #606266;
    line-height: 40px;
    padding-bottom: 12px;
}
#txtimageurl {
    padding: 8px;
    font-size: 14px;
    line-height: 24px;
    border: 1px solid #606266;
    border-radius: 4px;
    color: #606266;
}
.category {
    padding: 0 64px;
    box-sizing: border-box;
}
#ddlcategory {
    font-size: 14px;
    line-height: 24px;
    border-radius: 4px;
    color: #606266;
    background-color: #fff;
}
.button {
    padding: 24px 64px 64px;
    box-sizing: border-box;
}
#Button1 {
    float: right;
}
.button input {
    float: left;
}
#Button1,
.button input {
    height: 40px;
    padding: 8px 42px;
    line-height: 22px;
    color: #999aaa;
    font-size: 16px;
    text-align: center;
    font-weight: 500;
    border: 1px solid #555666;
    background-color: #fff;
    border-radius: 20px;
}
#Button1:hover,
.button input:hover {
    color: #093759
}

9、登录界面

(1)Web窗体Login.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="Myweb.Manager.Login" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>天眼Y-焦点事件速递</title>
    <!-- css初始化文件 -->
    <link rel="stylesheet" href="../css/Normalize.css"/>
    <!-- 公共的css样式 -->
    <link rel="stylesheet" href="../css/base.css"/>
    <!-- 登录页面的css样式 -->
    <link rel="stylesheet" href="../css/users.css"/>
</head>
<body>
    <!-- 页面头部分 -->
    <div class="middle" runat="server">
        <div class="nav clearfix w"  runat="server">
            <!-- logo部分 -->
            <div class="logo fl">
                <a href="../Default.aspx">
                    <asp:Image ID="Image1" runat="server" ImageUrl="~/images/logo_03.png" />
                </a>
            </div>
            <!-- 导航栏部分 -->
            <div class="navbar fl">
                <ul>
                    <li>
                        <asp:HyperLink ID="Home" runat="server" NavigateUrl="~/Default.aspx"><span>首页</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="News" runat="server" NavigateUrl="~/Manager/AddNews.aspx"><span>发布新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Manager" runat="server" NavigateUrl="~/Manager/Login.aspx"><span>管理新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Personal" runat="server" NavigateUrl="~/Stationmaster.aspx"><span>关于站长</span></asp:HyperLink>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 中间主体部分 -->
    <div class="w users" runat="server">
        <div class="users-in" runat="server">
            <form id="form1" runat="server">
                <asp:Image ID="Image2" runat="server" ImageUrl="~/images/logo_03.png" Width="90px" />
                <h1>登录</h1>
                <p>以继续管理新闻</p>
                <fieldset>
                    <legend>用户名</legend>
                    <asp:TextBox ID="txtAdmin" runat="server"></asp:TextBox>  
                </fieldset>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
                    ErrorMessage="  请输入用户名" ControlToValidate="txtAdmin"></asp:RequiredFieldValidator>
                <fieldset>
                    <legend>密 码</legend>
                    <asp:TextBox ID="txtPwd" runat="server" TextMode="Password"></asp:TextBox>
                </fieldset>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
                        ErrorMessage="  请输入密码" ControlToValidate="txtPwd"></asp:RequiredFieldValidator>
                <div class="towbutton clearfix">
                    <a href="Register.aspx">创建账号</a>
                    <asp:Button ID="Button1" runat="server" Text="完成" OnClick="Button1_Click" />
                </div>
            </form>
        </div>
    </div>
    <!-- 页面底部分 -->
    <div class="footer" runat="server">
        <div class="footer-in w">
            <h1>其他网站</h1>
            <p class="othernet">
                <a href="https://cn.bing.com/?scope=web&FORM=ANNTH1">必应</a>
                <a href="https://www.baidu.com/?tn=02003390_30_hao_pghttps://www.baidu.com/?tn=02003390_30_hao_pg">百度</a>
                <a href="https://vip.iqiyi.com/cps_pc.html">爱奇艺</a>
                <a href="https://www.mgtv.com/">芒果TV</a>
                <a href="https://www.suning.com/?utm_source=union&utm_medium=005007&adtype=5&utm_campaign=05946b19-7c4f-4443-b244-f1e37a23abbc&union_place=un">苏宁易购</a>
                <a href="https://www.msn.cn/zh-cn/lifestyle/shopping?ocid=msedgntp&cvid=2106713fc5ba43e29da7323af979881d">精选购物</a>
                <a href="https://tv.cctv.com/">CCTV</a>
                <a href="https://pages.tmall.com/wow/z/cs/act/wupr?wh_biz=tm&wh_pid=act%2Ftaokechengjie&ali_trackid=2:mm_1183900030_1813100136_110592400466:1652539528_078_1000156018&union_lens=lensId:OPT@1605248376@0bba6580_e459_175c0425fa9_4681@01;eventPageId:1586925572118;recoveryid:1652539528_078_1000156018&bxsign=tbkD7h3X8wzgVRh1OTmdJZONQCOsFcXMK1ccdlt6zI5/OzI77FFr0azst/1Dh91W9umglfxBkG+fu+pJknlCvwB8gGczvtxhl1LCeN9MnxGBpg=">天猫</a>
                <a href="https://www.taobao.com/">淘宝</a>
                <a href="https://www.jd.com/?cu=true&utm_source=c.mktdatatech.com&utm_medium=tuiguang&utm_campaign=t_16282_172613369&utm_term=b44015abbfe64f178dd3285a545224b2">京东</a>
                <a href="https://ms.vipstatic.com/union/deeplink/deeplink.html?link_url=vipshop%3A%2F%2FgoHome%3Ftra_from%3Dtra%3AC01V0000kve7p4us%3A%40_%401652539633245%3Amig_code%3A224842_168_0_QW5haGVpbVJNLXdlaXBpbmh1aQ%3D%3D_1%3A23939a8d04024296b4735f9ae37b39b9&dest_url=http%3A%2F%2Fwww.vip.com%2F">唯品会</a>
                <a href="https://www.xiaomiyoupin.com/">小米有品</a>
                <a href="https://hd.oppo.com/act/m/2021/CPS/index.html?title=title&utm_source=duomai&utm_medium=191943086">欢太商城</a>
                <a href="http://www.people.com.cn/">人民网</a>
                <a href="http://www.xinhuanet.com/">新华网</a>
            </p>
            <p>@ 2022年YJY Inc.保留所有权利。-19物联网工程有限公司</p>
        </div>
    </div>
</body>
</html>

(2)Login.aspx.cs

using System;
using System.Collections.Generic;
using System.Configuration;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Myweb.Manager
{
    public partial class Login : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            UnobtrusiveValidationMode = UnobtrusiveValidationMode.None;
        }

        public string connStr = ConfigurationManager.ConnectionStrings["NewsConnectionString"].ConnectionString;
        protected void Button1_Click(object sender, EventArgs e)
        {
            //获取登录名和密码信息
            String strLoginID = txtAdmin.Text;
            String strLoginPwd = txtPwd.Text;
            //访问数据库Newsuser表,验证登录账号
            //第一步建立连接对象conn
            SqlConnection conn = new SqlConnection(connStr);
            //设置SQL查询语句
            string sql = "select * from Newsuser where UserID='" + strLoginID + "' and UserPassword='" + strLoginPwd + "'";
            //创建sqlCommand对象
            SqlCommand cmd = new SqlCommand(sql, conn);
            //打开conn连接对象
            conn.Open();
            //利用SqlCommand对象,创建SqlDataReader对象,用于判断SQL语句执行的结果
            SqlDataReader dr = cmd.ExecuteReader();
            if (dr.Read()) //如果有数据,则dr.Read()为true
            {
                //登录验证成功
                //赋Session["Login"]值用于判断是否正常登录
                Session["LoginXX"] = "ok";
                Session["UserID"] = dr["UserID"].ToString();//获取匹配记录的用户名
                //登录成功后跳转
                Response.Redirect("~/Manager/EditNews.aspx");
            }
            else
            {
                //alert()弹窗函数
                Response.Write("<script>alert('用户名或密码错误,请重新输入!');</script>");
            }
        }
    }
}

 (3)css样式users

@font-face { /* 声明字体 */
    font-family: 'icomoon';
    src: url('../fonts/icomoon.eot?r5tos9');
    src: url('../fonts/icomoon.eot?r5tos9#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf?r5tos9') format('truetype'), url('../fonts/icomoon.woff?r5tos9') format('woff'), url('../fonts/icomoon.svg?r5tos9#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}
.users-in {
    width: 900px;
    margin: 0 auto;
}
#form1 {
    width: 530px;
    min-height: 500px;
    margin: 0 auto;
    border: 1px solid #dadce0;
    border-radius: 10px;
    position: relative;
}
#Image2 {
    position: absolute;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
}
.users-in h1 {
    display: block;
    margin-top: 180px;
    text-align: center;
    font-weight: normal;
    font-size: 24px;
    height: 50px;
    color: #202124;
}
.users-in p {
    text-align: center;
    height: 19px;
    font-size: 16px;
    padding-bottom: 26px;
    color: #202124;
    font-weight: 400;
}
.users-in fieldset {
    margin: 0 auto;
    height: 54px;
    width: 366px;
    border-radius: 5px;
    border-color: #1a73e8;
    color: #1a73e8;
    margin-top: 10px;
}
.users-in fieldset legend {
    margin-left: 10px;
    padding: 0 5px;
}
.users-in fieldset input {
    height: 10px;
    width: 336px;
    padding: 13px 15px;
    background-color: #f6f6f6;
    color: #202124;
    font-size: 17px;
}
.users-in span {
    font-family: icomoon;
    font-size: 14px;
    line-height: 250%;
    color: #d93025;
    margin-left: 80px;
}
.users-in .towbutton {
    height: 44px;
    width: 366px;
    margin: 50px auto;
}
.users-in .towbutton a {
    color: #1a73e8;
    font-size: 17px;
    line-height: 44px;
}
.users-in .towbutton input {
    height: 44px;
    width: 112px;
    display: block;
    float: right;
    background-color: #1a73e8;
    color: #fff;
    border-radius: 5px;
}

10、注册界面

(1)Web窗体Register.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Register.aspx.cs" Inherits="Myweb.Manager.Register" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>天眼Y-焦点事件速递</title>
    <!-- css初始化文件 -->
    <link rel="stylesheet" href="../css/Normalize.css"/>
    <!-- 公共的css样式 -->
    <link rel="stylesheet" href="../css/base.css"/>
    <!-- 登录页面的css样式 -->
    <link rel="stylesheet" href="../css/users.css"/>
</head>
<body>
    <!-- 页面头部分 -->
    <div class="middle" runat="server">
        <div class="nav clearfix w"  runat="server">
            <!-- logo部分 -->
            <div class="logo fl">
                <a href="../Default.aspx">
                    <asp:Image ID="Image1" runat="server" ImageUrl="~/images/logo_03.png" />
                </a>
            </div>
            <!-- 导航栏部分 -->
            <div class="navbar fl">
                <ul>
                    <li>
                        <asp:HyperLink ID="Home" runat="server" NavigateUrl="~/Default.aspx"><span>首页</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="News" runat="server" NavigateUrl="~/Manager/AddNews.aspx"><span>发布新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Manager" runat="server" NavigateUrl="~/Manager/Login.aspx"><span>管理新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Personal" runat="server" NavigateUrl="~/Stationmaster.aspx"><span>关于站长</span></asp:HyperLink>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 中间主体部分 -->
    <div class="w users" runat="server">
        <div class="users-in" runat="server">
            <form id="form1" runat="server">
                <asp:Image ID="Image2" runat="server" ImageUrl="~/images/logo_03.png" Width="90px" />
                <h1>注册</h1>
                <p>以继续登录</p>
                <fieldset>
                    <legend>用户名</legend>
                    <asp:TextBox ID="txtAdmin" runat="server"></asp:TextBox>
                </fieldset>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
                    ErrorMessage="用户名不能为空!" ControlToValidate="txtAdmin"></asp:RequiredFieldValidator>
                <fieldset>
                    <legend>密 码</legend>
                    <asp:TextBox ID="txtPwd" runat="server" TextMode="Password"></asp:TextBox>
                </fieldset>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
                    ErrorMessage="密码不能为空!" ControlToValidate="txtPwd"></asp:RequiredFieldValidator>
                <fieldset>
                    <legend>昵 称</legend>
                    <asp:TextBox ID="txtName" runat="server"></asp:TextBox>
                </fieldset>
                <div class="towbutton clearfix">
                    <a href="Login.aspx">返回登录</a>
                    <asp:Button ID="Button1" runat="server" Text="创建" OnClick="Button1_Click" />
                </div>
            </form>
        </div>
    </div>
    <!-- 页面底部分 -->
    <div class="footer" runat="server">
        <div class="footer-in w">
            <h1>其他网站</h1>
            <p class="othernet">
                <a href="https://cn.bing.com/?scope=web&FORM=ANNTH1">必应</a>
                <a href="https://www.baidu.com/?tn=02003390_30_hao_pghttps://www.baidu.com/?tn=02003390_30_hao_pg">百度</a>
                <a href="https://vip.iqiyi.com/cps_pc.html">爱奇艺</a>
                <a href="https://www.mgtv.com/">芒果TV</a>
                <a href="https://www.suning.com/?utm_source=union&utm_medium=005007&adtype=5&utm_campaign=05946b19-7c4f-4443-b244-f1e37a23abbc&union_place=un">苏宁易购</a>
                <a href="https://www.msn.cn/zh-cn/lifestyle/shopping?ocid=msedgntp&cvid=2106713fc5ba43e29da7323af979881d">精选购物</a>
                <a href="https://tv.cctv.com/">CCTV</a>
                <a href="https://pages.tmall.com/wow/z/cs/act/wupr?wh_biz=tm&wh_pid=act%2Ftaokechengjie&ali_trackid=2:mm_1183900030_1813100136_110592400466:1652539528_078_1000156018&union_lens=lensId:OPT@1605248376@0bba6580_e459_175c0425fa9_4681@01;eventPageId:1586925572118;recoveryid:1652539528_078_1000156018&bxsign=tbkD7h3X8wzgVRh1OTmdJZONQCOsFcXMK1ccdlt6zI5/OzI77FFr0azst/1Dh91W9umglfxBkG+fu+pJknlCvwB8gGczvtxhl1LCeN9MnxGBpg=">天猫</a>
                <a href="https://www.taobao.com/">淘宝</a>
                <a href="https://www.jd.com/?cu=true&utm_source=c.mktdatatech.com&utm_medium=tuiguang&utm_campaign=t_16282_172613369&utm_term=b44015abbfe64f178dd3285a545224b2">京东</a>
                <a href="https://ms.vipstatic.com/union/deeplink/deeplink.html?link_url=vipshop%3A%2F%2FgoHome%3Ftra_from%3Dtra%3AC01V0000kve7p4us%3A%40_%401652539633245%3Amig_code%3A224842_168_0_QW5haGVpbVJNLXdlaXBpbmh1aQ%3D%3D_1%3A23939a8d04024296b4735f9ae37b39b9&dest_url=http%3A%2F%2Fwww.vip.com%2F">唯品会</a>
                <a href="https://www.xiaomiyoupin.com/">小米有品</a>
                <a href="https://hd.oppo.com/act/m/2021/CPS/index.html?title=title&utm_source=duomai&utm_medium=191943086">欢太商城</a>
                <a href="http://www.people.com.cn/">人民网</a>
                <a href="http://www.xinhuanet.com/">新华网</a>
            </p>
            <p>@ 2022年YJY Inc.保留所有权利。-19物联网工程有限公司</p>
        </div>
    </div>
</body>
</html>

(2)Register.aspx.cs

using System;
using System.Collections.Generic;
using System.Configuration;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Myweb.Manager
{
    public partial class Register : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            UnobtrusiveValidationMode = UnobtrusiveValidationMode.None;
        }

        public string connStr = ConfigurationManager.ConnectionStrings["NewsConnectionString"].ConnectionString;
        protected void Button1_Click(object sender, EventArgs e)
        {
            //获取登录名和密码信息
            String strLoginID = txtAdmin.Text;
            String strLoginPwd = txtPwd.Text;
            String strLoginName = txtName.Text;
            //访问数据库Newsuser表,注册信息
            //第一步建立连接对象conn
            SqlConnection conn = new SqlConnection(connStr);
            //设置SQL查询语句
            string sql = "insert into [Newsuser](UserID,UserPassword,UserName) values('" + strLoginID + "','" + strLoginPwd + "','" + strLoginName +"')";
            //创建sqlCommand对象
            SqlCommand cmd = new SqlCommand();
            //打开conn连接对象
            conn.Open();
            if(check(strLoginID, cmd))
            {
                cmd.Connection = conn;
                cmd.CommandText = sql;
                //建dr存储ExecuteNonQuery结果,用于判断SQL语句执行的结果
                int dr = cmd.ExecuteNonQuery();
                if (dr > 0) //如果有数据,则dr.Read()为true
                {
                    //注册成功
                    Response.Write("<script>alert('注册成功!');</script>");
                    //注册成功后跳转
                    Response.Redirect("Login.aspx");
                }
                else
                {
                    //alert()弹窗函数
                    Response.Write("<script>alert('注册失败!');</script>");
                }
            }
            else
            {
                Response.Write("<script>alert('用户名已存在!');</script>");
            }
            
        }
        protected bool check(string u, SqlCommand cmd)
        {
            //建立连接对象conn
            SqlConnection conn1 = new SqlConnection(connStr);
            //设置SQL查询语句
            string sql1 = "select * from Newsuser where UserID='" + u + "'";
            //打开conn连接对象
            conn1.Open();
            cmd.Connection = conn1;
            cmd.CommandText = sql1;
            //利用SqlCommand对象,创建SqlDataReader对象,用于判断SQL语句执行的结果
            SqlDataReader dr = cmd.ExecuteReader();
            if (dr.Read()) //如果有数据,则dr.Read()为true
            {
                return false;
            }
            else
            {
                return true;
            }
        }
    }
}

(3)css样式users.css

同登录界面

11、管理新闻界面

(1)Web窗体Edit.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="EditNews.aspx.cs" Inherits="Myweb.Manager.EditNews" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>天眼Y-焦点事件速递</title>
    <!-- css初始化文件 -->
    <link rel="stylesheet" href="../css/Normalize.css"/>
    <!-- 公共的css样式 -->
    <link rel="stylesheet" href="../css/base.css"/>
    <!-- 管理界面的css样式 -->
    <link rel="stylesheet" href="../css/edit.css"/>
</head>
<body>
    <!-- 页面头部分 -->
    <div class="middle" runat="server">
        <div class="nav clearfix w"  runat="server">
            <!-- logo部分 -->
            <div class="logo fl">
                <a href="../Default.aspx">
                    <asp:Image ID="Image1" runat="server" ImageUrl="~/images/logo_03.png" />
                </a>
            </div>
            <!-- 导航栏部分 -->
            <div class="navbar fl">
                <ul>
                    <li>
                        <asp:HyperLink ID="Home" runat="server" NavigateUrl="~/Default.aspx"><span>首页</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="News" runat="server" NavigateUrl="~/Manager/AddNews.aspx"><span>发布新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Manager" runat="server" NavigateUrl="~/Manager/Login.aspx"><span>管理新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Personal" runat="server" NavigateUrl="~/Stationmaster.aspx"><span>关于站长</span></asp:HyperLink>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 中间主体部分 -->
    <div class="w edit" runat="server">
        <form id="form1" runat="server">
            <div class="clearfix">
                <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="NewsID" DataSourceID="SqlDataSource1" >
                    <Columns>
                        <asp:BoundField DataField="NewsTitle" HeaderText="新闻标题" SortExpression="NewsTitle"/>
                        <asp:BoundField DataField="NewsData" HeaderText="内容" SortExpression="NewsData" />
                        <asp:BoundField DataField="NewsDate" HeaderText="发布时间" SortExpression="NewsDate" />
                        <asp:BoundField DataField="NewsImageUrl" HeaderText="图片路径" SortExpression="NewsImageUrl" />
                        <asp:BoundField DataField="NewsCategory" HeaderText="新闻类别" SortExpression="NewsCategory" />
                        <asp:CommandField ShowEditButton="True" HeaderText="编辑" EditText="" />
                        <asp:CommandField ShowDeleteButton="True" HeaderText="删除" DeleteText="" />
                    </Columns>
                </asp:GridView>
                <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NewsConnectionString %>" DeleteCommand="DELETE FROM [NewsInfo] WHERE [NewsID] = @NewsID" InsertCommand="INSERT INTO [NewsInfo] ([NewsTitle], [NewsData], [NewsDate], [NewsImageUrl], [NewsCategory]) VALUES (@NewsTitle, @NewsData, @NewsDate, @NewsImageUrl, @NewsCategory)" SelectCommand="SELECT * FROM [NewsInfo]" UpdateCommand="UPDATE [NewsInfo] SET [NewsTitle] = @NewsTitle, [NewsData] = @NewsData, [NewsDate] = @NewsDate, [NewsImageUrl] = @NewsImageUrl, [NewsCategory] = @NewsCategory WHERE [NewsID] = @NewsID">
                    <DeleteParameters>
                        <asp:Parameter Name="NewsID" Type="Int32" />
                    </DeleteParameters>
                    <InsertParameters>
                        <asp:Parameter Name="NewsTitle" Type="String" />
                        <asp:Parameter Name="NewsData" Type="String" />
                        <asp:Parameter Name="NewsDate" Type="DateTime" />
                        <asp:Parameter Name="NewsImageUrl" Type="String" />
                        <asp:Parameter Name="NewsCategory" Type="String" />
                    </InsertParameters>
                    <UpdateParameters>
                        <asp:Parameter Name="NewsTitle" Type="String" />
                        <asp:Parameter Name="NewsData" Type="String" />
                        <asp:Parameter Name="NewsDate" Type="DateTime" />
                        <asp:Parameter Name="NewsImageUrl" Type="String" />
                        <asp:Parameter Name="NewsCategory" Type="String" />
                        <asp:Parameter Name="NewsID" Type="Int32" />
                    </UpdateParameters>
                </asp:SqlDataSource>
            </div>
        </form>
    </div>
    <!-- 页面底部分 -->
    <div class="footer" runat="server">
        <div class="footer-in w">
            <h1>其他网站</h1>
            <p class="othernet">
                <a href="https://cn.bing.com/?scope=web&FORM=ANNTH1">必应</a>
                <a href="https://www.baidu.com/?tn=02003390_30_hao_pghttps://www.baidu.com/?tn=02003390_30_hao_pg">百度</a>
                <a href="https://vip.iqiyi.com/cps_pc.html">爱奇艺</a>
                <a href="https://www.mgtv.com/">芒果TV</a>
                <a href="https://www.suning.com/?utm_source=union&utm_medium=005007&adtype=5&utm_campaign=05946b19-7c4f-4443-b244-f1e37a23abbc&union_place=un">苏宁易购</a>
                <a href="https://www.msn.cn/zh-cn/lifestyle/shopping?ocid=msedgntp&cvid=2106713fc5ba43e29da7323af979881d">精选购物</a>
                <a href="https://tv.cctv.com/">CCTV</a>
                <a href="https://pages.tmall.com/wow/z/cs/act/wupr?wh_biz=tm&wh_pid=act%2Ftaokechengjie&ali_trackid=2:mm_1183900030_1813100136_110592400466:1652539528_078_1000156018&union_lens=lensId:OPT@1605248376@0bba6580_e459_175c0425fa9_4681@01;eventPageId:1586925572118;recoveryid:1652539528_078_1000156018&bxsign=tbkD7h3X8wzgVRh1OTmdJZONQCOsFcXMK1ccdlt6zI5/OzI77FFr0azst/1Dh91W9umglfxBkG+fu+pJknlCvwB8gGczvtxhl1LCeN9MnxGBpg=">天猫</a>
                <a href="https://www.taobao.com/">淘宝</a>
                <a href="https://www.jd.com/?cu=true&utm_source=c.mktdatatech.com&utm_medium=tuiguang&utm_campaign=t_16282_172613369&utm_term=b44015abbfe64f178dd3285a545224b2">京东</a>
                <a href="https://ms.vipstatic.com/union/deeplink/deeplink.html?link_url=vipshop%3A%2F%2FgoHome%3Ftra_from%3Dtra%3AC01V0000kve7p4us%3A%40_%401652539633245%3Amig_code%3A224842_168_0_QW5haGVpbVJNLXdlaXBpbmh1aQ%3D%3D_1%3A23939a8d04024296b4735f9ae37b39b9&dest_url=http%3A%2F%2Fwww.vip.com%2F">唯品会</a>
                <a href="https://www.xiaomiyoupin.com/">小米有品</a>
                <a href="https://hd.oppo.com/act/m/2021/CPS/index.html?title=title&utm_source=duomai&utm_medium=191943086">欢太商城</a>
                <a href="http://www.people.com.cn/">人民网</a>
                <a href="http://www.xinhuanet.com/">新华网</a>
            </p>
            <p>@ 2022年YJY Inc.保留所有权利。-19物联网工程有限公司</p>
        </div>
    </div>
</body>
</html>

 (2)css样式edit.css

@font-face { /* 声明字体 */
    font-family: 'icomoon';
    src: url('../fonts/icomoon.eot?r5tos9');
    src: url('../fonts/icomoon.eot?r5tos9#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf?r5tos9') format('truetype'), url('../fonts/icomoon.woff?r5tos9') format('woff'), url('../fonts/icomoon.svg?r5tos9#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}
tbody {
    border-color: #ccc;
}
tr {
    overflow: hidden;
    display: table;
    width: 1190px;
    overflow: hidden;
}
th {
    display: block;
    background-color: #7c4e8d;
    color: #d7ecf3;
    height: 50px;
    float: left;
    text-align: center;
    line-height: 50px;
}
td {
    height: 60px;
    float: left;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 60px;
}
td input {
    width: 100%;
    height: 60px;
    overflow: scroll;
    white-space: normal;
}
td a {
    font-family: icomoon;
    color: #666;
}
td a:hover {
    color: #7c4e8d;
}
tr th:nth-child(1),
tr td:nth-child(1) {
    width: 80px;
}
tr th:nth-child(2),
tr td:nth-child(2) {
    width: 520px;
}
tr th:nth-child(3),
tr td:nth-child(3),
tr td:nth-child(3) input {
    width: 180px;
    text-align: center;
}
tr th:nth-child(4),
tr td:nth-child(4) {
    width: 186px;
}
tr th:nth-child(5),
tr td:nth-child(5),
tr td:nth-child(5) input {
    width: 80px;
    text-align: center;
}
tr th:nth-child(6),
tr td:nth-child(6),
tr td:nth-child(6) input {
    width: 70px;
    text-align: center;
}
tr th:nth-child(7),
tr td:nth-child(7),
tr td:nth-child(7) input {
    width: 60px;
    text-align: center;
}

12、站长页面

(1) Web窗体Stationmaster.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Stationmaster.aspx.cs" Inherits="Myweb.Stationmaster" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>天眼Y-焦点事件速递</title>
    <!-- css初始化文件 -->
    <link rel="stylesheet" href="css/Normalize.css"/>
    <!-- 公共的css样式 -->
    <link rel="stylesheet" href="css/base.css"/>
    <!-- 站长页面的css样式 -->
    <link rel="stylesheet" href="css/master.css"/>
</head>
<body>
    <!-- 页面头部分 -->
    <div class="middle" runat="server">
        <div class="nav clearfix w"  runat="server">
            <!-- logo部分 -->
            <div class="logo fl">
                <a href="Default.aspx">
                    <asp:Image ID="Image1" runat="server" ImageUrl="~/images/logo_03.png" />
                </a>
            </div>
            <!-- 导航栏部分 -->
            <div class="navbar fl">
                <ul>
                    <li>
                        <asp:HyperLink ID="Home" runat="server" NavigateUrl="~/Default.aspx"><span>首页</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="News" runat="server" NavigateUrl="~/Manager/AddNews.aspx"><span>发布新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Manager" runat="server" NavigateUrl="~/Manager/Login.aspx"><span>管理新闻</span></asp:HyperLink>
                    </li>
                    <li>
                        <asp:HyperLink ID="Personal" runat="server" NavigateUrl="~/Stationmaster.aspx"><span>关于站长</span></asp:HyperLink>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 中间主体部分 -->
    <div class="yjy" runat="server">
        <div class="yjy-in" runat="server">
            <form id="form1" runat="server">
                <div class="avatar">
                    <asp:Image ID="Image" runat="server" ImageUrl="~/images/avatar.png" Width="150px" />
                    <div class="wechat"></div>
                </div>
                <div class="name">
                    <span>姓名:</span>
                    <span>你的名字</span>
                </div>
                <div class="class">
                    <span>班级:</span>
                    <span>你的班级</span>
                </div>
                <div class="id">
                    <span>学号:</span>
                    <span>你的学号</span>
                </div>
                <div class="project">
                    <span>项目:</span>
                    <span>小型网站建设</span>
                </div>
                <div class="teachter">
                    <span>指导:</span>
                    <span>你的老师</span>
                </div>
                <div class="time">
                    <span>时间:</span>
                    <span>你的创作时间</span>
                </div>
                <div class="school">
                    <span>学校:</span>
                    <span><a href="#">你的学校网址</a></span>
                </div>
            </form>
        </div>
    </div>
    <!-- 页面底部分 -->
    <div class="footer" runat="server">
        <div class="footer-in w">
            <h1>其他网站</h1>
            <p class="othernet">
                <a href="https://cn.bing.com/?scope=web&FORM=ANNTH1">必应</a>
                <a href="https://www.baidu.com/?tn=02003390_30_hao_pghttps://www.baidu.com/?tn=02003390_30_hao_pg">百度</a>
                <a href="https://vip.iqiyi.com/cps_pc.html">爱奇艺</a>
                <a href="https://www.mgtv.com/">芒果TV</a>
                <a href="https://www.suning.com/?utm_source=union&utm_medium=005007&adtype=5&utm_campaign=05946b19-7c4f-4443-b244-f1e37a23abbc&union_place=un">苏宁易购</a>
                <a href="https://www.msn.cn/zh-cn/lifestyle/shopping?ocid=msedgntp&cvid=2106713fc5ba43e29da7323af979881d">精选购物</a>
                <a href="https://tv.cctv.com/">CCTV</a>
                <a href="https://pages.tmall.com/wow/z/cs/act/wupr?wh_biz=tm&wh_pid=act%2Ftaokechengjie&ali_trackid=2:mm_1183900030_1813100136_110592400466:1652539528_078_1000156018&union_lens=lensId:OPT@1605248376@0bba6580_e459_175c0425fa9_4681@01;eventPageId:1586925572118;recoveryid:1652539528_078_1000156018&bxsign=tbkD7h3X8wzgVRh1OTmdJZONQCOsFcXMK1ccdlt6zI5/OzI77FFr0azst/1Dh91W9umglfxBkG+fu+pJknlCvwB8gGczvtxhl1LCeN9MnxGBpg=">天猫</a>
                <a href="https://www.taobao.com/">淘宝</a>
                <a href="https://www.jd.com/?cu=true&utm_source=c.mktdatatech.com&utm_medium=tuiguang&utm_campaign=t_16282_172613369&utm_term=b44015abbfe64f178dd3285a545224b2">京东</a>
                <a href="https://ms.vipstatic.com/union/deeplink/deeplink.html?link_url=vipshop%3A%2F%2FgoHome%3Ftra_from%3Dtra%3AC01V0000kve7p4us%3A%40_%401652539633245%3Amig_code%3A224842_168_0_QW5haGVpbVJNLXdlaXBpbmh1aQ%3D%3D_1%3A23939a8d04024296b4735f9ae37b39b9&dest_url=http%3A%2F%2Fwww.vip.com%2F">唯品会</a>
                <a href="https://www.xiaomiyoupin.com/">小米有品</a>
                <a href="https://hd.oppo.com/act/m/2021/CPS/index.html?title=title&utm_source=duomai&utm_medium=191943086">欢太商城</a>
                <a href="http://www.people.com.cn/">人民网</a>
                <a href="http://www.xinhuanet.com/">新华网</a>
            </p>
            <p>@ 2022年YJY Inc.保留所有权利。-19物联网工程有限公司</p>
        </div>
    </div>
</body>
</html>

(2)css样式master.css

.yjy-in {
    width: 816px;
    margin: 0 auto;
}
#form1 {
    min-height: 500px;
    border: 1px solid #dadce0;
    border-radius: 5px;
    background-color: #fff;
    position: relative;
}
.avatar {
    position: absolute;
    top: 70px;
    left: 90px;
}
.avatar img {
    border-radius: 5px;
}
.wechat {
    position: relative;
}
.wechat { 
    height: 200px;
    width: 0;
    position: absolute;
    top: 180px;
    left: -25px;
    background: url(../images/WeChat.png);
    background-size: 200px 200px;
    transition: all 0.2s;
}
.avatar:hover .wechat {
    width: 200px!important;
}
.name,
.class,
.id,
.project,
.teachter,
.time,
.school {
    width: 300px;
    color: #606266;
    line-height: 40px;
    font-size: 24px;
    font-weight: 600;
    box-sizing: border-box;
    border-bottom: 1px solid #606266;
    position: absolute;
    left: 40%;
    padding-left: 30px;
}
.school a {
    color: #606266;
    line-height: 40px;
    font-size: 24px;
    font-weight: 600;
}
.school a:hover {
    color: #7c4e8d;
}
.name {
    
    top: 50px;
}
.class {
    top: 100px;
}
.id {
    top: 150px;
}
.project {
    top: 200px;
}
.teachter {
    top: 250px;
}
.time {
    top: 300px;
}
.school {
    top: 350px;
}

总结

通过该网站的制作,我对ASP.NET有了更深层次的了解,也有了一些兴趣。同时我也对之前学习的html、css等前端开发技术在网页制作的过程与一些技巧手法有了加以深入的理解,对网页制作的一些常用手法也更加地熟练。

在具体的制作的过程中我认为一个网页的设计应该具备以下一些条件:

①确定网页设计的内容

    一个网站要有一个明确的主题,整个网站围绕这个主题,在网页设计之前要明确网站有什么目的,是用来做什么,所有页面都是围绕着这个内容来制作,有了明确的内容就可以对网页进行一些前期的排版设计。

    ②做一个用户

    在制作网页的过程中应该以用户身份亲身体验网站的各种功能才能真正地去发现问题和解决问题,才知道哪些地方需要加以改进,尽量不要让用户去发现问题,在前期设计时就应该把这些问题解决。

    ③优化内容

内容是整个网站的核心。在网站设计之前必须明确网站的内容安排。在具体的规划一个网站时,可以用树状结构先把每个页面的内容大纲列出来,尤其要制作一个大的网站(的时候,特别需要把这个架构规划好,也要考虑到以后可能的扩充性,免得做好以后又要一改再改整个网站的架构,免得浪费时间和精力。

猜你喜欢

转载自blog.csdn.net/weixin_55915644/article/details/124974460