使用Bootstrap，我如何创建多个全屏div来彼此堆叠 [英] Using Bootstrap, how can I create multiple fullscreen div's to stack on one another

问题描述

我想创建一个包含多个100％div的页面，并将它们堆叠在一起。类似于 Bootstrap封面模板示例，但在第一个屏幕下方添加了div。我试过四处寻找，但一直未能找到解决方案。我知道它在那里，也许我只是在寻找错误的东西。

I'd like to create a page with multiple 100% divs, stacked on top of one another. Similar to the Bootstrap Cover Template Example, but with additional div's underneath the first screen. I've tried looking around a lot but haven't been able to find a solution. I know it's out there, maybe I'm just searching for the wrong things.

推荐答案

使用100％高度的div解决不了你的问题。既然你已经看过引导程序，我假设你不害怕使用Javascript或Jquery。因此，您可以使用这个小代码将div的高度始终设置为屏幕的100％。

Using div's with a 100% height won't solve your problem. Since you're already looking at the Bootstrap I assume that you're not afraid of using Javascript or Jquery. Therefor, you can use this little code to set the height of you div always 100% of your screen.

$("div_name").css("min-height", $(window).height() );

使用这个小代码，将会设置包裹你的部分的div的高度。因此，对于需要窗口高度（100％）的网站的每个部分，您必须使用包装器div。所以它会是这样的：

Using this little code, will set the height of your div that's wrapping your section. So, for every part of your website that needs the height of your window ( 100% ) you have to use a 'wrapper' div. So it would be something like this:

<div class="section">
    <h2>Section 1!</h2>
    <p>This is just an section with the same height as your browser.</p>
</div>
<div class="section">
    <h2>Section 2!</h2>
    <p>This is just an section with the same height as your browser.</p>
</div>

如果您需要示例，您可以查看我的投资组合： http://portfolio.stikkie.net/

If you want an example, you can take a look at my portfolio: http://portfolio.stikkie.net/

这篇关于使用Bootstrap，我如何创建多个全屏div来彼此堆叠的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！