【发布时间】：2015-06-11 12:00:26
【问题描述】：
我正在尝试使用Cordova 和Ionic Framework 制作跨平台应用程序。在我尝试使用实际设备运行该应用程序之前，它似乎运行良好。我一直在 Android 和本地浏览器的涟漪模拟器下进行测试，并得到以下结果（这是预期的结果）：
但是，当我将程序发送到我的 Android 设备进行调试时，我得到了以下结果：
当我在 Windows Phone 下运行时，我得到以下结果：
我主要关心的是 android 波纹模拟器和设备之间的区别。我认为 windows phone 的一些本地文件存在问题，需要修改，并且由于某种原因尺寸不匹配，所以页脚太低了。
Android 设备的问题（我认为）是它抛出错误“无效的 CSS 属性值：...”当我运行到设备时，文件 ionic.min 中大约有 40 个无效的 CSS 属性值.css。当我针对纹波模拟器时，不会出现这些警告。我尝试了多次重组我的项目并使用完整的 ionic.css 文件，但都没有解决这个问题。这些只是警告，应用程序确实编译和运行，但没有达到所需的外观，这让我想如果我能解决这些 CSS 问题，我就能解决这个问题。
值得注意的是，我正在运行 Windows 8.1，使用 VS2013 和 Cordova 工具来构建/编译/运行。
编辑：
运行 Android 4.4
有问题的代码不是我的 CSS（因为我没有，而是 Ionic 的 css，所以我将发布我当前的使用情况。）
index.html（我省略了几页，但遵循此结构。）
<ion-nav-bar class="bar-positive">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view></ion-nav-view>
<script id="templates/tabs.html" type="text/ng-template">
<ion-tabs class="tabs-icon-top tabs-positive">
<ion-tab title="Home" icon="ion-home" href="#/tab/home">
<ion-nav-view name="home-tab"></ion-nav-view>
</ion-tab>
<!--
<ion-tab title="About" icon="ion-ios-information" href="#/tab/about">
<ion-nav-view name="about-tab"></ion-nav-view>
</ion-tab>
<ion-tab title="Contact" icon="ion-ios-world" ui-sref="tabs.contact">
<ion-nav-view name="contact-tab"></ion-nav-view>
</ion-tab>
-->
</ion-tabs>
</script>
<script id="templates/home.html" type="text/ng-template">
<ion-view view-title="Home">
<ion-content class="padding">
<div><a class="button icon icon-right ion-chevron-right" href="#/tab/resources">Additional Resources</a></div>
<div><a class="button icon icon-right ion-chevron-right" href="#/tab/gmetrics">Global Metrics</a></div>
<div><a class="button icon icon-right ion-chevron-right" href="#/tab/gfeed">Global Feed</a></div>
<div><a class="button icon icon-right ion-chevron-right" href="#/tab/googleforms">Google Forms</a></div>
<div><a class="button icon icon-right ion-chevron-right" href="#/tab/social">Social Networking</a></div>
<div><a class="button icon icon-right ion-chevron-right" href="#/tab/chapters">Chapters</a></div>
</ion-content>
</ion-view>
</script>
App.js（完整版）
angular.module('app', ['ionic'])
.config(function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state('tabs', {
url: "/tab",
abstract: true,
templateUrl: "templates/tabs.html"
})
.state('tabs.home', {
url: "/home",
views: {
'home-tab': {
templateUrl: "templates/home.html",
controller: 'HomeTabCtrl'
}
}
})
.state('tabs.resources', {
url: "/resources",
views: {
'home-tab': {
templateUrl: "templates/resources.html"
}
}
})
.state('tabs.gmetrics', {
url: "/gmetrics",
views: {
'home-tab': {
templateUrl: "templates/gmetrics.html"
}
}
})
.state('tabs.gfeed', {
url: "/gfeed",
views: {
'home-tab': {
templateUrl: "templates/gfeed.html"
}
}
})
.state('tabs.googleforms', {
url: "/googleforms",
views: {
'home-tab': {
templateUrl: "templates/googleforms.html"
}
}
})
.state('tabs.social', {
url: "/social",
views: {
'home-tab': {
templateUrl: "templates/social.html"
}
}
})
.state('tabs.chapters', {
url: "/chapters",
views: {
'home-tab': {
templateUrl: "templates/chapters.html"
}
}
});
$urlRouterProvider.otherwise("/tab/home");
})
.controller('HomeTabCtrl', function ($scope) {
console.log('HomeTabCtrl');
});
【问题讨论】：
-
虽然屏幕截图可能会有所帮助，但如果没有看到有问题的代码，很难给出有效的答案。请附上相关代码。
-
安卓系统版本好吗？
-
用代码编辑，虽然我没有添加任何自定义 CSS。添加了 Android 4.4。
标签： css cordova ionic-framework ionic