html - 最小高度最小宽度不适用于 Cordova

标签 html css cordova

我正在尝试使用 cordova,但我忘记了过去关于 html 和 css 的大部分知识...但我想在容器内创建一个简单的 3 div 布局,每个布局的高度为 33%,宽度为 100%。这是我的 html:

 <body>
        <div class="container">
              <div class="ctn1">
              <h2>ddd</h2>
              </div>
              <div class="ctn2">
              </div>    
              <div class="ctn3">
              </div>    
            </div>
        </div>
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" src="js/index.js"></script>
    </body>

和我的CSS:

body{
    height: 100%;
    min-height: 100%;

}

.container{

    height:100%;
    width:100%;

}
.ctn1{
    min-height: 33%;
    min-width: 100%;
    background-color: red;
}
.ctn2{
    min-height: 33%;
    min-width: 100%;
    background-color: yellow;
}
.ctn3{
    min-height: 33%;
    min-width: 100%;
    background-color: blue;
}

背景只显示里面的文字...谢谢

最佳答案

在 CSS 中继承高度总是有点棘手。

您需要为 htmlbody 提供 100% 的高度并移除它们的默认边距。此外,确保默认的 h2 边距保留在其容器内,使您的容器 overflow: hidden

Here's your updated JSFiddle

关于html - 最小高度最小宽度不适用于 Cordova ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32882034/

相关文章:

html - CSS 使用 List-Style-Image 调整文本在 HTML 列表中的位置

html - 防止文本环绕 float 图像

iphone - 用 iPhone 覆盖@media CSS

javascript - Flexslider IMG 在 768px 及以下设置为 0x0

javascript - Cordova 应用程序重新加载图像 (SVG)

android - 找不到具有 "images"表的 Cordova SQLitePlugin

html - 如何设置/修改 Django 文件字段的样式?

html - 如何从servlet重定向到新页面

jquery - 在 Javascript 函数中向按钮添加 CSS 背景颜色

angular - 防止定时器在后台模式下暂停