我创建了一个网站，与桌面相比，Android 平板电脑和移动设备上的所有文本都增加了一些像素。
想复制一个小例子。
这是我的 html 代码:
<body>
<h3>MAKING OF</h3>
</body>
这是CSS代码:
body {
text-align: center;
padding-top: 50px;
}
html {
font-size: 62.5%;
}
@font-face {
font-family: MPL;
src: local("MPL"),
url(fonts/MPL.ttf),
url(fonts/MPL.eot);
}
h3 {
font-family: MPL;
font-size: 30px;
font-size: 3rem;
height: 60px;
line-height: 60px;
padding: 0px 12px;
background-color: #5496F2;
color: #000;
}
可能有人知道文本在平板电脑上未正确对齐的原因。
这是在桌面浏览器上右对齐的截图
这是平板电脑浏览器问题的截图
在台式机上，这在 FF 和 Chrome 中都可以正常工作，但在 Android 平板电脑上，它在 Chrome 和 FF 浏览器上都错误对齐，而且在 ios Safari 浏览器上也无法正常工作。这是链接:
http://inants.com/kadmos/web/kad/a/a
希望有人能帮助理解这个问题，并提出最佳解决方案。
谢谢。
最佳答案
遇到过类似的问题。看起来是导致问题的自定义字体。尝试用 Sans-serif 等通用字体替换自定义字体。 尚不确定如何使用导致问题的相同自定义字体来解决问题。
关于android - android 和 ios 中的文本垂直对齐问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21309249/