gpt4 book ai didi

html - Bootstrap 制作全宽全高列

转载 作者:太空宇宙 更新时间:2023-11-04 08:09:33 26 4
gpt4 key购买 nike

我有以下布局:

<body>
<nav class="navbar navbar-inverse">
...
</nav>

<div class="jumbotron">
...
</div>

<div class="container">
<div class="row">
<div class="col-xs-12">...</div>
</div>

<div class="row">
<div class="col-xs-4">...</div>
<div class="col-xs-4">...</div>
<div class="col-xs-4">...</div>
</div>
</div>
</body>

导航栏和标题占屏幕宽度的 100%。然而,这些列却没有——巨大的空白边距保留在屏幕的左右边缘附近。

如果我删除 container div,所有内容都会占用 100% 的空间并且它对我来说工作正常,但我不确定这是否是一个好习惯,因为在所有示例中 container 被使用。另外,我想让列占据页面末尾的所有空间,但不确定是否需要 container 来完成它。

最佳答案

根据 Bootstrap 文档,需要一个容器。如果您想要全 Angular 容器,可以使用 container-fluid 而不是 container。您可以在此处的 Bootstrap 3 文档中找到它:

http://getbootstrap.com/docs/3.3/css/#grid

您可以在此处的 Bootstrap 4 文档中找到相关信息:

https://getbootstrap.com/docs/4.0/layout/overview/

关于html - Bootstrap 制作全宽全高列,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46393063/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com