ASP MVC默认应用程序生成的删除空格 [英] asp mvc default application generated remove white spaces

问题描述

因此，当生成一个mvc项目时，它具有其默认的母版页以及部分视图(例如注册视图和登录视图).问题在于，母版页的生成是在页面的左侧和右侧带有默认的空白区域我的问题是:那边距代码写在哪里以及如何删除它?看起来很简单，我似乎找不到它.

So when a mvc project is genereted it has his default master page and partial views like the register and login views.The problem is that the master page is genereted with default white spaces on the left side of the page and on the right side.My question is : Where is that margin space code written and how to remove it?As simple as it looks I just can't seem to find it.

Site.css保留其默认值:

Site.css is left with its default values:

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也很简单:

And my indes.cshtml is alsaw pretty simple:

@{
    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>

我尝试在body-content类中添加margin-left:0和margin-right:0，但是它只是将子页面移到左侧并保持其大小.

I tried adding margin-left:0 and margin-right:0 to the body-content class but it just moves the child page to the left and maintains the size of it.

推荐答案

存在空白是因为默认情况下，通过Visual Studio创建的ASP.NET MVC项目使用

The whitespace is there because, by default, an ASP.NET MVC project created through Visual Studio uses the Bootstrap CSS Framework. I recommend you learn to use it - it will make your front-end development magnitudes easier.

在解决您的问题时，您会发现两边带有空格"的内容嵌套在具有类container的div中.删除此类并使用container-fluid会删除空格，并使容器变为全屏宽度.

Addressing your question, you'll find that the content with the "whitespace" either side is nested in a div which has the class container. Removing this class and using container-fluid will remove the whitespace and make the container full-screen-width instead.

不要尝试通过Bootstrap覆盖容器上设置的margin，而会在其他地方破坏Bootstrap的样式.

Don't try to override the margin set on containers by Bootstrap, you'll ruin Bootstrap's styling elsewhere.

这篇关于ASP MVC默认应用程序生成的删除空格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！