创建第二个连接sql server的asp.net页面初始页面

Expecto Potronum

已于 2023-08-09 15:55:14 修改

阅读量45

点赞数 1

文章标签： asp.net 后端

于 2023-08-07 17:46:11 首次发布

本文链接：https://blog.csdn.net/weixin_50483586/article/details/132146713

版权

计划在此页面中放置一个主页，同时给出登录和注册的选项。为什么要登录注册分开呢？因为我在之前的登录页面里对用户名和密码增加了ASP.NET RequiredFieldValidator 控件，使得这两项不能为空，所以在未输入ID和密码之前不能注册（哦好奇怪的控件）。其实也可以删除相关控件，但是由于本人刚入门超级小菜，想学习和尝试相关控件的使用，所以就添加一个主页来解决！

（这里提出的一个不确定的点是，是由于相关控件会在编译时也进行编译、所以即使把注册的跳转指令放在点击登录的相关指令之前，也不能跳转。哦好奇怪的控件！（主要是我使用得不够熟练））

下面开始实践！

一、设置背景

修改body内容如下：<body style="background-color: transparent; background-image: url(IMG/3.jpg);background-size:cover;background-attachment: fixed;">

这句话是一个内联样式（inline style），应用于 <body> 元素。每个样式属性的含义：

background-color: transparent;：这个属性设置了背景颜色为透明。透明背景意味着页面内容下方的元素或背景图像将会显示出来。在这种情况下，由于后续的 background-image 属性设置了背景图像，所以透明背景颜色将不会显示。
background-image: url(IMG/3.jpg);：这个属性设置了背景图像的URL，图像文件路径为 "IMG/3.jpg"。这意味着将使用指定的图像作为背景。
background-size: cover;：这个属性设置了背景图像的大小调整方式。cover 表示背景图像将被调整为覆盖整个元素的背景区域，并且保持图像的纵横比例不变。这样可以确保图像完全填充背景，并且可能会被裁剪以适应元素的大小。
background-attachment: fixed;：这个属性设置了背景图像的滚动行为。fixed 表示背景图像将固定在视口中，不会随页面的滚动而移动。这意味着即使用户滚动页面，背景图像仍然保持在固定的位置。

二、设置button位置

添加一个2*1的表，在两行中分别插入两个按钮（button）；
在<head><style>中修改相关属性，使得按钮靠下。我的设置如下：
设置align = "center"使得按钮居中，效果如下：
两个按钮的设置类似，效果如下：

感觉button有点单调难看，进行一些.css的修改，简单来说是在Button中添加了class，使得可以对按钮进行属性设置，代码如下:

<head>
...
<style>
...
.button-style {
            width: 135px; /* 设置按钮的宽度 */
            height: 35px; /* 设置按钮的高度 */
            font-size: 14px; /* 设置按钮的字体大小 */
            border-radius: 10px; /* 设置按钮的圆角半径 */
            box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.8); /* 添加更明显的阴影效果 */
        }

    </style>
</head>

<body style="background-color: transparent; background-image: url(IMG/3.jpg);background-size:cover;background-attachment: fixed;">&nbsp;<form id="form1" runat="server">
        <table class="auto-style1">
            <tr>
                <td align="center" aria-dropeffect="none" class="auto-style2" >
                    <asp:Button ID="Button1" runat="server" Text="Register" class="button-style"/>
                </td>
            </tr>
...

执行效果如下（还是很单调哈哈哈）：

三、添加button行为

在设计页面中双击Register按钮跳转到相应代码（Register是写好的注册页面，下一篇文章写）：
```
Response.Redirect("Register.aspx");
```
在设计页面中双击Login按钮跳转到相应代码（Login是写好的注册页面，上一篇文章已完成）：
```
Response.Redirect("Login.aspx");
```
就可以实现跳转啦！
但是我觉得我的登录页面有点难看，修正一下子，稍微美观一些，后续继续修正：
完成！！✿✿ヽ(°▽°)ノ✿