asp mvc默认应用程序生成删除空格

Question

因此，当mvc项目生成时，它有默认的母版页和部分视图，如注册视图和登录视图。问题是母版页在页面左侧和右侧都有默认的空格。我的问题是：写的保证金空间代码在哪里以及如何删除它？看起来很简单，我似乎无法找到它。

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;
}

我的indes.cshtml很简单：

@{
    ViewBag.Title = "Home Page";
}

<div id="mapa">
    <h1>ASP.NET</h1>
</div>

<div id="content">
    <div class="main-nav-wrapper">
        <nav class="navbar navbar-default">
            <div class="container-fluid">
                <div class="navbar-header">
                    <a class="navbar-brand" href="#">WebSiteName</a>
                </div>
                <ul class="nav navbar-nav">
                    <li class="active"><a href="#">Home</a></li>
                    <li><a href="#">Page 1</a></li>
                    <li><a href="#">Page 2</a></li>
                    <li><a href="#">Page 3</a></li>
                </ul>
            </div>
        </nav>
    </div>
    </div>

我尝试将margin-left：0和margin-right：0添加到body-content类，但它只是将子页面向左移动并保持其大小。

Answer 1

空白是因为默认情况下，通过Visual Studio创建的ASP.NET MVC项目使用Bootstrap CSS Framework。我建议你学会使用它 - 这将使你的前端开发量更容易。

解决您的问题，您会发现内容包含＆＃34;空白＆＃34;任何一方都嵌套在具有类div的{​​{1}}中。删除此类并使用container将删除空格并使容器成为全屏宽度。

请勿尝试通过Bootstrap覆盖容器上的container-fluid集，否则会破坏Bootstrap在其他地方的样式。

Answer 2

或者在你的

中

  

_layout.cshtml

你只需要替换这个标签

<div class="container body-content">

这一个：

 <div class="container-fluid body-content">

Answer 3

您应该更改正文内容的最大宽度 的site.css

.body-content {
    padding-left: 15px;
    padding-right: 15px;
    max-width:100%;
}