Html 角度-音位间隙-“；最小高度：100%“；根本不工作_Html_Css_Angularjs_Cordova

Html 角度-音位间隙-“；最小高度：100%“；根本不工作

html css angularjs cordova

Html 角度-音位间隙-“；最小高度：100%“；根本不工作,html,css,angularjs,cordova,Html,Css,Angularjs,Cordova,我有这个html文件： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="format-detection" content="telephone=no" /> <!-- WARNING: for iOS 7, remove the width=device-width and height=

我有这个html文件：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />
        <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
        <link rel="stylesheet" type="text/css" href="css/platform.css" />
        <title>1001Carros</title>
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" src="js/angular.min.js"></script>
        <script type="text/javascript" src="js/angular-route.min.js"></script>
        <script type="text/javascript" src="js/angular-resource.min.js"></script>
        <script type="text/javascript" src="js/index.js"></script>
        <script type="text/javascript">
            document.addEventListener("deviceready", function(){
                angular.bootstrap(document, ['Application']);
            }, false);
        </script>
    </head>
    <body ng-view></body>
</html>

在那些

@import

ed文件中，没有为

#block footer

或

#block content

、

html

、

body

或

#block content ender

定义更多规范

最后，ng视图（位于

body

标记中）指令通过

ngRoute

正确地将以下内容放入其中：

<div id="block-logo">
    <button id="btn-go-main" class="btn-blue-gradient"></button>
</div>
<div id="block-search">
    <div id="search-box">
        <div id="search-box-btn" ng-click="doSearch()"></div>
        <input type="text" id="search-box-text" ng-model="searchText" placeholder="Buscar Ej. Rojo, Chevrolet, Vitara" />
    </div>
</div>
<div id="block-content">
    <div id="floating-guys">
        <div id="tall-guy"></div>
        <div id="short-guy"></div>
    </div>
    <div id="main-menu">
        <ul id="options" class="menu">
            <li ng-repeat="button in buttons"
                ng-attr-id="button.id"
                ng-class="{'menu-row': true, 'section': button.section, 'clickable': !button.section}"
                ng-style="button.styles"
                ng-click="button.click()">
                {{ button.text }}
            </li>
        </ul>
    </div>
    <div id="block-content-ender"></div>
</div>
<div id="block-footer">
    Lugar para el banner de pie
</div>

只是因为它有一个类似蓝色的背景色

我所期望的是，

#块内容

应该具有身体的最小高度（即，由于

#块内容

的背景是蓝色的，我期望在底部看到一个剩余的、空的、蓝色的部分）

不幸的是，

#block content

中的

min height

样式不起作用：它根本不起作用-如果我移除它，效果是一样的（即，由于主体的背景是绿色的，我实际上在底部看到了一个剩余的绿色部分）

除此之外，内容正如我所期望的那样工作——与ngRoute完全没有问题

我的问题是：为什么？我想要的是这样的块至少有身体的高度

我还尝试了在体内放置一个div并保持ng view指令：

<!DOCTYPE html> <html>  <body> <div id="content" ng-view></div> </body> </html>
但两者都没有任何效果（即
#content
的背景是红色的->我希望有一个剩余的红色部分；但是我看到了一个剩余的绿色部分->后面的
主体再说一遍：我怎么能强迫这样100%高的跳水运动员注意：这与背景色无关。实际上，我需要将#块页脚固定在底部，至少是设备高度的-100%（它将保持页脚横幅）。关于您的高度问题，您需要明确地将html 标记设置为100%高度。子元素只能使用具有显式设置的高度的父元素的参照高度属性。在html 设置了明确的高度后，您可以将body 设置为minheight 100% 关于页脚，要将页脚粘贴到可视视口的底部，请执行以下操作： footer { position: fixed; height: 100px; bottom: 0; width: 100%; } 关于你的身高问题——你需要明确地将html 标记设置为100%高度。子元素只能使用具有显式设置的高度的父元素的参照高度属性。在html 设置了明确的高度后，您可以将body 设置为minheight 100% 关于页脚，要将页脚粘贴到可视视口的底部，请执行以下操作： footer { position: fixed; height: 100px; bottom: 0; width: 100%; } 这可能会有所帮助，但如果由于某种原因，网站的实际内容达到100%或更多，固定页脚将与该内容重叠。另外，如果我需要我的#block content 具有自定义背景，那么如果页面内容高度低于100%html，并且正文的最小高度已经达到100%，我将不会看到它一直延伸到底部。我试着让他们有100%的身高，而不是100%的最小身高，效果是一样的。耶！它通过使用高度而不是最小高度来工作！如果缓存出现问题（或者IDE没有保存），可能会有所帮助，但如果由于某种原因，站点的实际内容达到100%或更多，则固定页脚将与该内容重叠。另外，如果我需要我的#block content具有自定义背景，那么如果页面内容高度低于100%html，并且正文的最小高度已经达到100%，我将不会看到它一直延伸到底部。我试着让他们有100%的身高，而不是100%的最小身高，效果是一样的。耶！它通过使用高度而不是最小高度来工作！有缓存问题（或者IDE没有保存） /* this style still existed */ html, body { min-height: 100%; margin: 0; background-color: green; } #content { min-height: 100%; background-color: red; } footer { position: fixed; height: 100px; bottom: 0; width: 100%; }