html
<body>
<form>
<h4 style="text-align:center">登录中心</h4>
<hr />
<br />
<div class="row mb-5">
<label class="col-sm-2 col-form-label">名称:</label>
<div class="col-sm-10">
<input class="form-control" type="text">
</div>
</div>
<div class="row mb-5">
<label class="col-sm-2 col-form-label">密码:</label>
<div class="col-sm-10">
<input class="form-control" type="text">
</div>
</div>
<div class="row">
<input type="submit" value="登录" class="btn btn-success"style="width: 200px; height: 35px; margin: auto; background-color: #3864b1;" />
</div>
<div class="row">
<a style="text-align:right;" href="/Login/Register">注册用户</a>
</div>
</form>
</body>
style样式
body {
height: 100%;
background-image: url("/Content/img/bg1.jpg");
background-size: cover;
background-repeat: no-repeat;
position: relative;
}
form {
border-radius: 8px;//圆角
width: 465px;
height: 400px;
position: absolute;
padding:25px;
top: 30%;
bottom: 30%;
left: 40%;
background: rgb(128, 128, 128,.2);
/*背景颜色灰色,透明度为0.8*/
box-sizing:border-box;
/*box-sizing设置盒子模型的解析模式为怪异盒模型,24 将border和padding划归到width范围内*/
box-shadow: 0px 15px 25px rgba(0,0,0,.5);
/*边框阴影 水平阴影0 垂直阴影15px 模糊25px 颜色黑色透明度0.5*/
}