5

私はサイトに取り組んでいますが、いくつかの問題があります。皆さんが私を助けてくれることを願っています:)

  1. メニューのテキストを太字にすると、Firefox :S では太すぎて見えますが、Chrome では問題なく見えます。

  2. Firefox では、#content コンテナの二重枠は影の効果の外側にあります :S が、Chrome では見栄えがします。

Mac Firefox 5.0.1 および Chrome 13.0.782.112 の スクリーン ショット:

これは私のプロジェクトです。

誰かがこれで私を助けてくれることを願っています。

私にできるもっと良いことがあれば、それも喜んでお聞きします:)

4

2 に答える 2

3

ブラウザ間でフォントの見た目が異なるという最初の問題はbold、ブラウザがテキストを異なる方法でレンダリングするためです。代わりに画像を使用するという恐ろしいルートに行かない限り、それについてできることは何もありません。

あなたの2番目の問題はborder、ではなく、outline. outlineこれは、Firefox がwhenbox-shadowを適用する際に解釈する方法が原因で発生します。代わりに影の外側に適用します。

css に以下のコードを挿入して、Firefox をターゲットにし、アウトラインを元に戻すことができます。

@-moz-document url-prefix() {
    #content{
        outline-offset: -11px;
    }
}

実際の例: http://jsfiddle.net/tw16/n8bet/

于 2011-08-13T14:18:17.143 に答える
1

@1: ブラウザごとにフォントのレンダリングに違いがあります。結果を絞り込むために、単に太字にする代わりに数値を試すことができます ( http://clagnut.com/blog/2228/ )。この SO エントリの回答もお読みください。

@2: #content css から次の行を削除します。

outline: 1px solid #B9BDBE;
于 2011-08-13T14:14:11.663 に答える