小编Kad*_*s B的帖子

android和ios中的文本垂直对齐问题

我创建了一个网站,其中所有文本都是针对Android平板电脑和移动设备中的一些像素与桌面相比.

想复制一个小例子.

这是我的HTML代码:

<body>
      <h3>MAKING OF</h3>
</body>

Run Code Online (Sandbox Code Playgroud)

这是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;
}

Run Code Online (Sandbox Code Playgroud)

任何人都可以知道文本在平板电脑上没有正确对齐的原因.

这是桌面浏览器上右对齐的屏幕截图在此输入图像描述