Ionic Framework：在Android设备上测试应用程序时，应用程序的文本模糊不清

Question

我只是遭受了巨大的欺骗！我刚刚完成了我的应用程序的第一个版本，所以我继续在Android设备上测试它...应用程序的内容很模糊！

您可以在屏幕截图中看到它。看起来文本无法在列表中正确显示。您还可以看到保存按钮有点变形。

它来自哪里？

好吧，我已经注意到我使用style.css定制的应用程序元素看起来很模糊，并且属于Ionic框架的元素显示正确。问题可能来自这里，因为它可能来自完全不同的东西，老实说我不知道​​。

我该如何解决这个问题？

非常好！

谢谢！

PS：屏幕截图实际上比应用程序中的外观模糊一点。

编辑：

#test{
color: white;
margin-top: 5px;
}
#location{
float: left;
}
#timeIn{
text-align: right;
color: red;
}
#timeOut{
text-align: right;
color: green;
}
#check{
display: block;
}

Answer 1

我遇到了同样的问题，它只发生在使用远程主机的开发过程中。不使用--livereload标志进行测试来确认。

希望它可以帮助别人。

Answer 2

这与字体渲染有关。 与--livereload

没有任何关系

您可以在CSS中使用字体平滑功能来绕过此操作，而可以通过浏览器/网络视图或其他方式强制使用。

我的建议是启用抗锯齿CSS：

 -webkit-font-smoothing: antialiased;
 -font-smoothing: antialiased;

..另一方面，如果启用了亚像素/抗锯齿功能，似乎离子会自动切换到“ ios”模式。去图：）