VS中的.aspx中 设置成 <div class="row"> <div class="col-md-4"><asp:Button Text ="编辑" runat ="server" Class="btn-warning btn-block btn" Width ="100px " /></div>的asp的3个Button按钮 如何 控制间距
时间: 2023-07-19 21:21:17 浏览: 56
您可以使用CSS样式来控制这些按钮之间的间距。对于这个特定的例子,您可以尝试使用以下CSS代码:
```
<style>
.row .col-md-4 {
margin-bottom: 10px; /* 控制按钮之间的垂直间距 */
}
.row .col-md-4 .btn {
margin-right: 10px; /* 控制按钮之间的水平间距 */
}
</style>
```
您可以将这些CSS样式添加到您的.aspx文件的头部或链接到外部CSS文件中。然后,将`<div class="row">`中的三个按钮包装在一个`<div class="col-md-4">`元素中。
请注意,这些样式可能需要根据您的具体布局和样式进行微调。
相关问题
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="Hotel.WebForm1" EnableEventValidation="false" %> <!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></title> <link rel="stylesheet" href="Assets/Libraries/Bootstrap/css/bootstrap.min.css" /> <style> body{ background-image:url(../Assets/Images/hotel4.jpg); background-size:cover; } .container-fluid{ opacity:0.9; } </style> </head> <body> <form id="form1" runat="server" > <div> <div class="container-fluid"> <div class="row" style="height:200px"></div> <div class="row"> <div class="col-md-4"></div> <div class="col-md-4 bg-light rounded-3"> <h1 class="text-text-success text-center">皇家理工度假酒店</h1> <form> <div class="mb-3"> <label for="UserTb" class="form-label">用户名</label> <input type="text" class="form-control" id="UserTb" runat="server" required="required"> </div> <div class="mb-3"> <label for="PasswordTb" class="form-label">密码</label> <input type="password" class="form-control" id="PasswordTb" runat="server" required="required"> </div> <div class="mb-3"> <label id="ErrMsg" class="text-danger" runat="server"></label> <input type="radio" id="AdminCb" runat="server" name="Role"><label class="text-success">管理员</label> <input type="radio" id="UserCb" runat="server" name="Role"><label class="text-success">用户</label> </div> <div class="d-grid"> <asp:Button ID="LoginBtn" runat="server" Text="登陆" class="btn btn-success btn-block" OnClick="LoginBtn_Click" /> </div> <br /> </form> </div> <div class="col-md-4"></div> </div> </div> </div> </form> </body> </html>我在form中添加了align=center属性但是删除后却依旧运行了原先配置
根据你提供的代码,我没有发现在form标签中有align=center属性。可能是你误解了代码中的某个元素所表现的效果。请注意,在HTML5中,align属性已被废弃,建议使用CSS来控制元素的对齐。另外,如果你想让整个表单居中,可以使用以下CSS代码:
```css
form {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
```
这将使表单在垂直和水平方向上都居中对齐。
<form id="form1" runat="server"> <div style="height:100%;width:100%;position:absolute;"> <div id="TopLogo" style="height:35%;width:100%;"> <asp:Image ID="img" runat="server" Height="100%" Width="100%" ImageUrl="~/Image/Login/welcome.jpg" /> </div> <div id="navigate" style="height:5%;width:100%;"> <table class="auto-style1"> <tr> <td style="color:rgb(242,46,0)" class="auto-style2"> 你好,<strong><asp:Label ID="lblName" runat="server"></asp:Label></strong> ! </td> <td class="auto-style3"> <asp:HyperLink ID="LinkGoods" runat="server" Font-Bold="true" NavigateUrl="~/User/SelectGoods.aspx">商品页</asp:HyperLink> </td> <td class="auto-style4"> <asp:HyperLink ID="LinkHome" runat="server" Font-Bold="true" NavigateUrl="~/User/HomePage.aspx">个人首页</asp:HyperLink> </td> </tr> </table> </div> <br /><br /> <div id="wel" style="text-align:center;"> 欢迎光临购物商城! </div> </div> </form>
这是一个 ASP.NET Web Form 页面的源代码,展示了一个具有欢迎信息、导航链接和个人信息的页面布局。页面分为三部分:页面顶部的商城 Logo,导航栏,以及欢迎信息。导航栏中有两个链接,一个是指向商品页的超链接,另一个是指向个人首页的超链接。在欢迎信息中,会根据用户登录信息来显示用户的姓名。