Jquery无法工作!Jumotron类无法工作

XuDong Peng-MSFT 10,841 Microsoft 供应商

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Admin_Login.aspx.cs" Inherits="TMS_Project.admin.Admin_Login" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Admin Login</title>
    <link href="../assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    <link href="../dist/sweetalert2.min.css" rel="stylesheet" />
    <script src="../dist/sweetalert2.min.js"></script>
</head>
<body style="background-color:whitesmoke">
    <form id="form1" runat="server">
        <div class="container">
            
            <div class="row">

                <div class="col-md-4 mx-auto" style="box-shadow: -2px 2px 29px 1px rgba(0,0,0,0.75); -webkit-box-shadow: -2px 2px 29px 1px rgba(0,0,0,0.75); -moz-box-shadow: -2px 2px 29px 1px rgba(0,0,0,0.75);">
                    <div class="jumbotron text-center text-white bg-primary">   
                        <h2>Admin Login</h2>
                    </div>
                    <asp:TextBox ID="UsernameTxt" placeholder="Enter Username" CssClass="form-control" runat="server"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="UsernameTxt" ForeColor="Red" SetFocusOnError="true" Display="Dynamic" runat="server" ErrorMessage="Username is required"></asp:RequiredFieldValidator>
                    <br />  
                    <asp:TextBox ID="PasswordTxt" TextMode="Password" placeholder="Enter Password" CssClass="form-control" runat="server"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" ControlToValidate="PasswordTxt" ForeColor="Red" SetFocusOnError="true" Display="Dynamic" runat="server" ErrorMessage="Password is required"></asp:RequiredFieldValidator>
                    <br />
                    <asp:Button ID="LoginBtn" OnClick="LoginBtn_Click" runat="server" Text="Login" CssClass="btn btn-primary btn-block" />
                    <br />
                </div>

            </div>
        </div>
    </form>
    <script src="../assets/vendor/jquery/jquery.min.js"></script>
    <script src="../assets/vendor/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>

Note：该问题整理于：Jquery is not working! Class Jumotron does not work

接受的答案

Zhi Lv - MSFT 32,741 Microsoft 供应商

你好，

要使用 Bootstrap Jumbotron，您只需使用 Bootstrap.css 文件。

从您的代码中不清楚您正在使用哪个版本的 Bootstrap，可能是因为它较旧。

您可以尝试以下代码：

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Admin Login</title>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css"/>
 </head>
<body style="background-color:whitesmoke">
    <form id="form1" runat="server">
        <div class="container">
           
            <div class="row">
 
                <div class="col-md-4 mx-auto" style="box-shadow: -2px 2px 29px 1px rgba(0,0,0,0.75); -webkit-box-shadow: -2px 2px 29px 1px rgba(0,0,0,0.75); -moz-box-shadow: -2px 2px 29px 1px rgba(0,0,0,0.75);">
                    <div class="jumbotron text-center text-white bg-primary">  
                        <h2>Admin Login</h2>
                    </div>
                    <asp:TextBox ID="UsernameTxt" placeholder="Enter Username" CssClass="form-control" runat="server"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="UsernameTxt" ForeColor="Red" SetFocusOnError="true" Display="Dynamic" runat="server" ErrorMessage="Username is required"></asp:RequiredFieldValidator>
                    <br />  
                    <asp:TextBox ID="PasswordTxt" TextMode="Password" placeholder="Enter Password" CssClass="form-control" runat="server"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" ControlToValidate="PasswordTxt" ForeColor="Red" SetFocusOnError="true" Display="Dynamic" runat="server" ErrorMessage="Password is required"></asp:RequiredFieldValidator>
                    <br />
                    <asp:Button ID="LoginBtn"  runat="server" Text="Login" CssClass="btn btn-primary btn-block" />
                    <br />
                </div>
 
            </div>
        </div>
    </form>
 
</body>
</html>

结果如下：

User's image

如果答案是正确的解决方案，请单击“接受答案”并请投赞成票。如果您对此答案有其他疑问，请点击“评论”。

注意：如果您想接收此线程的相关电子邮件通知，请按照我们文档中的步骤启用电子邮件通知。

最好的问候

通过

Jquery无法工作!Jumotron类无法工作

0 个其他答案

你的答案