Javascript Bootstrap/Css-2个分区相同高度

我有HTML+CSS代码。我需要第一个div（第一排，白色）来表示容器高度的前一半，第二个div（第二排，橙色）表示容器高度的第二部分。 这是我的html： 还有我的css：

---

修改后的答案：在意识到默认方法不适用于HTML之后，这应该是可行的。您有类。内容分别为第1行和第2行。您可以使用这些来告诉相应的行始终使用高度的某一部分。为此，您还需要手动修复定位。（如果可以更优雅地完成，请有人纠正我）例如，这些类可能看起来像：

    .content-row-1 {
       background: #eee;
       position: absolute;
       top: 10%;
       display: block;
       height: 40%;  
       width: 100%;
    }

我注意到您的页脚已经占据了高度的10%，并且假设您不希望有任何重叠或间隙。为了实现这一点，你还应该给你的标题一个高度百分比（在我的例子中是10%，以保持简单）

---

将来：在显示代码示例时尝试使用。我把它放在。

试着把所有

媒体的
col-*-6
给你的2行
行
，谢谢。这解决了我的两个div的问题。我想问一个附加问题-在屏幕改变时，使用引导列来更改主体元素的最佳方式是什么？我的意思是，现在它是4x2布局，因为每当我把col-xs-12这样的东西放在这些元素中的任何一个上时，它都是I。所以它们在md中是4x2行，在xs中是1x8行，等等。图像都快疯了，那么你应该再仔细看看我做的不同屏幕大小的预定义类。它是关于如何在col-XX类中正确地显示元素基本上，您必须通过添加-xs-和-md-类来指定所有变体的行为，您目前只使用-xs-。你的问题似乎有点复杂，所以也许只是开始一个新的问题，而不是在评论中解决这个问题。