3

私はこのトピックに関する既存のリンクをたどっていますが、私の場合は何も役に立たないようです。

すべてが、テキストを垂直方向に移動して、整列して表示されるようにする方法を提案しています。私の場合の問題は、それがすでにChromeで整列されていることです。そのため、Firefoxのテキストを整列しようとすると、Chromeのテキストが整列しなくなります。

Firefox（v12）とChrome（v19）で次のリンクを開いてください。

http://jsfiddle.net/UQ4D5/

Firefoxでは上に移動しますが、Chromeでは完全に整列していることがわかります。

4

3 に答える 3

4

CSS の 2 つのプロパティ

 display: table-cell;
    vertical-align: middle;

ライブデモをチェックhttp://jsfiddle.net/UQ4D5/5/

于 2012-05-29T05:39:20.777 に答える
1

ブラウザーのレンダリング モデルの小さな違いを防ぐために、reset.cssまたはnormalize.cssの使用方法を学びます。

次に、height=line-heightトリックを使用します。

div {
    font-size: 100px;
    text-align: center;
    height: 120px;
    line-height: 120px;
    border: 1px solid black;
}

クロム メトリック:
ここに画像の説明を入力
Firefox メトリック:
ここに画像の説明を入力

高さはどちらも同じです。

于 2012-05-29T05:45:29.160 に答える
0

この問題は、ブラウザのデフォルトのスタイルシートに基づいています。適切なリセットスタイルシートまたはnormalize.cssを使用することをお勧めします

于 2012-05-29T05:36:51.697 に答える