如何解决如何删除页面顶部的空白区域?
我不知道该空间到哪个地方
我在mvc项目中添加了一个登录页面,默认情况下,页面顶部有空白
查看此参考
checkLogin.cshtml
@{
ViewBag.Title = "checkLogin";
}
@using (Html.BeginForm("checkLogin","Home",FormMethod.Post))
{
<div class="limiter">
<div class="container-login100">
<div class="wrap-login100">
<form class="login100-form validate-form">
<span class="login100-form-title p-b-26">
kosmoanuaf
</span>
<span class="login100-form-title p-b-48">
<i class="zmdi zmdi-eye"></i>
</span>
<div class="wrap-input100 validate-input" data-validate="Valid email is: a@b.c">
<span class="btn-show-pass">
<i class="glyphicon glyphicon-envelope"></i>
</span>
<input class="input100" type="text" name="username" required/>
<span class="focus-input100" data-placeholder="Email"></span>
</div>
<div class="wrap-input100 validate-input" data-validate="Enter password">
<span class="btn-show-pass">
<i class="zmdi zmdi-eye"></i>
</span>
<input class="input100" type="password" name="password" required/>
<span class="focus-input100" data-placeholder="Password"></span>
</div>
<div class="container-login100-form-btn">
<div class="wrap-login100-form-btn">
<div class="login100-form-bgbtn"></div>
<button class="login100-form-btn">
Login
</button>
</div>
</div>
</form>
</div>
</div>
</div>
}
_Layout.cshtml(母版页)
<!DOCTYPE html>
<html>
<head>
<Meta charset="utf-8" />
<Meta name="viewport" content="width=device-width,initial-scale=1.0">
<link href="~/Content/bootstrap.css" rel="stylesheet" />
<link href="~/Content/font-awesome.css" rel="stylesheet" />
<link href="~/Content/custom.css" rel="stylesheet" />
<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css' />
<link href="~/Content/Site.css" rel="stylesheet" type='text/css' />
@*login page*@
<link rel="icon" type="image/png" href="images/icons/favicon.ico" />
<link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="~/fonts/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="~/fonts/iconic/css/material-design-iconic-font.min.css" rel="stylesheet" type="text/css" />
<link href="~/vendor/animate/animate.css" rel="stylesheet" type="text/css" />
<link href="~/vendor/css-hamburgers/hamburgers.min.css" rel="stylesheet" type="text/css" />
<link href="~/vendor/animsition/css/animsition.min.css" rel="stylesheet" type="text/css" />
<link href="~/vendor/daterangepicker/daterangepicker.css" type="text/css" rel="stylesheet" />
<link href="~/vendor/select2/select2.min.css" rel="stylesheet" type="text/css" />
<link href="~/Content/util.css" rel="stylesheet" type="text/css" />
<link href="~/Content/main.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<script src="~/Scripts/jquery.metisMenu.js"></script>
<script src="~/Scripts/custom.js"></script>
@RenderBody()
@*login page*@
<div id="dropDownSelect1"></div>
<script src="~/vendor/jquery/jquery-3.2.1.min.js"></script>
<script src="~/vendor/animsition/js/animsition.min.js"></script>
<script src="~/vendor/bootstrap/js/popper.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<script src="~/vendor/select2/select2.min.js"></script>
<script src="~/vendor/daterangepicker/moment.min.js"></script>
<script src="~/vendor/daterangepicker/daterangepicker.js"></script>
<script src="~/vendor/countdowntime/countdowntime.js"></script>
<script src="~/Scripts/main.js"></script>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts",required: false)
</body>
</html>
site.css
body {
padding-top: 50px;
padding-bottom: 20px;
}
/* Set padding to keep content from hitting the edges */
.body-content {
padding-left: 15px;
padding-right: 15px;
}
/* Override the default bootstrap behavior where horizontal description lists
will truncate terms that are too long to fit in the left column
*/
.dl-horizontal dt {
white-space: normal;
}
/* Set width on the form input elements since they're 100% wide by default */
input,select,textarea {
max-width: 280px;
}
哪些地方需要更正
解决方法
我认为这是我可以在body的css中看到的问题 https://prnt.sc/ugthje
,尝试:
body {
padding-top: 0;
padding-bottom: 20px;
}
将主体的padding-top设置为0或将其删除。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。