在移动Web工具包浏览器中，是否有任何纯CSS唯一的解决方案可以将页脚固定在页面底部？_Css_Mobile Safari_Mobile Website_Mobile Webkit

在移动Web工具包浏览器中，是否有任何纯CSS唯一的解决方案可以将页脚固定在页面底部？

css

在移动Web工具包浏览器中，是否有任何纯CSS唯一的解决方案可以将页脚固定在页面底部？,css,mobile-safari,mobile-website,mobile-webkit,Css,Mobile Safari,Mobile Website,Mobile Webkit,在移动Web工具包浏览器中，是否有任何纯CSS唯一的解决方案可以将页脚固定在底部特别是在iPhone和Android浏览器中。 #footer { position: fixed; bottom: 0; } 从iOS5开始工作。不太好。那些浏览器实际上不使用滚动；他们将文档放在一个无限的画布上，然后在画布上平移。这或多或少是语义上的黄鼠狼措辞，表示它们不支持位置：在实践中已修复。使用flexbox:） @我刚刚试着在iPad上测试它，但是JSFIDLE的结果窗格被完全扩展了（

在移动Web工具包浏览器中，是否有任何纯CSS唯一的解决方案可以将页脚固定在底部

特别是在iPhone和Android浏览器中。

#footer {
   position: fixed;
   bottom: 0;
}

从iOS5开始工作。

不太好。那些浏览器实际上不使用滚动；他们将文档放在一个无限的画布上，然后在画布上平移。这或多或少是语义上的黄鼠狼措辞，表示它们不支持

位置：在实践中已修复。
使用flexbox:）

@我刚刚试着在iPad上测试它，但是JSFIDLE的结果窗格被完全扩展了（即没有滚动条）。注意：这在大多数移动浏览器上不起作用，原因如下。将在最新的iPad上使用。但是要注意flexbox的一些问题，即从box-*到flex-*的变化，以及这里涉及的其他问题：虽然这是一个很好的用途，但我真的希望它不会成为主要的布局方式。我同意，不要相信在这一点上，至少这项技术会取代桌面浏览器的其他页面布局技术，它确实适用于上面示例中的简单移动布局。对于主流布局，我有一个OOCSS的交叉点，一个简单的网格和内联块，它们弥补了ie中几乎没有的布局问题。90%以上的浏览器市场份额支持。
<body>
    <div id="mainPart"></div>
    <footer></footer>
</body

<style>
body { 
   display: -webkit-box; -webkit-box-align: stretch; -webkit-box-orient: vertical;  
   display: -moz-box; -moz-box-align: stretch; -moz-box-orient: vertical;
 } 

#mainPart { -webkit-box-flex: 1;  -moz-box-flex: 1; position: relative; z-index: 2;}
footer{
      background-color:#FFC579;
      height:50px;
      position: relative; z-index: 3;
 }