我使用最新版Cordova的bootstrap为Android和Windows Phone 8构建应用程序。
我为我的主要顶级视图定义了一个bootstrap navbar-fixed-bottom div。
在Android设备上,导航栏将覆盖窗口底部附近的内容。要解决这个问题,我需要指定一个css样式:
body {
padding-bottom: 70px;
}
<。>在.css文件中。
在Windows Phone 8上,导航栏似乎浮动在页面上方70个像素。
按照Cordova文档中的推荐指南,我将一个overrides.css文件添加到顶层&#39;合并&#39;两个平台的文件夹。 android一个与上面相同,但是wp8文件指定了0px的填充底部。我还将overrides.css的空白副本添加到我的顶级/ www文件夹中。应用于body的样式仅在overrides.css中定义。
然后我在我的主index.html文件中加载overrides.css。
在我的Android设备上加载代码,似乎&#39;合并/ android&#39;中的正文样式目录未应用。导航栏返回覆盖我页面的一部分,并且不允许我进一步向下滚动。
在wp8上,它仍悬浮在页面底部之上。
我已尝试在main.css文件之前和之后加载overrides.css。我还确保main.css中的任何内容都不能覆盖body属性。我还从顶级/ www文件夹中删除了空白的overrides.css文件。
如果将它放在顶级/ www overrides.css文档中,我似乎只能让body css工作。这不是我想要的,因为它应该被取代。
什么可能阻止平台特定的身体样式正确应用?
答案 0 :(得分:1)
事实证明,Cordova CLI创建的merges文件夹必须与&#39; / www&#39;以下的所有内容具有相同的文件夹结构。根文件夹。
我试图覆盖的.css文件位于&#39; / www / css&#39;。
在合并文件夹中,我错过了&#39; / css&#39;子文件夹并且有类似&#39; merges / Android / overrides.css&#39;,它应该是&#39; merges / Android / css / overrides.css&#39;。
答案 1 :(得分:0)
您可以随时使用获取设备平台 device.platform 并根据平台,指定css。比如,如果device.platform返回Android,那么你可以应用你现有的css,或者如果它返回WinCE或Win32NT,那么你可以为Windows Phone指定另一个css。