0

フィドル_

高さ 10px、幅 181px の 3 つの背景画像があります。幅 181px で高さが可変の要素の内部で、画像 1 を要素の上部に、画像 2 を要素の下部に配置し、画像 3 をずっと下に繰り返します。コードは次のとおりです。

#sidemenu li a.currentpage {
    background:     url(images/sm-urhere_top.png) no-repeat center top,
            url(images/sm-urhere_bottom.png) no-repeat center bottom,
            url(images/sm-urhere_bg.png) repeat-y center top;
    }

sm-urhere_top.png と sm-urhere_bottom.png はどちらも少しぼやけていますが (効果は気に入っています)、images/sm-urhere_bg.png はくっきりしています。実際、sm-urhere_top.png または sm-urhere_bottom.png を sm-urhere_bg.png に置き換えると、繰り返さないとぼやけるだけです。同じプログラムを使用して 3 つの画像すべてを作成しました。それらは同じサイズで、それぞれ同じ圧縮で保存しました。何を与える？

編集: Firefox ではなく、Chrome でのみ発生するようです。クロムが繰り返されない場合にのみ画像をぼかす理由はありますか? クロムで繰り返される画像をぼかす方法はありますか?

前もって感謝します。

要素の HTML は次のとおりです。

`<ul class="normal">`
`    <li><a href="#" title="This is the description." class="currentpage">Current Page</a></li>`
`</ul>`

わかりました、私はそれを理解したと思います-ちょっと。上下の画像は角を丸くしています。何らかの理由で、クロムは隅のディテールを認識し、画像をぼかして見栄えを良くします。解決するために、中央の画像に少し個別のディテールを追加しました。

同じ画像が繰り返されない場合、クロムがなぜ同じ画像をぼかすのか、まだ理解できません。しかし、それはそれが何であるかです。

4

1 に答える 1

0

私は同じ問題を抱えていて、それは私を1時間夢中にさせました...グーグルは私に効果だけを指摘しました..バグではありません:)

したがって、将来の参考のために、110％であっても、一部のpng背景（メニューやボタンのコーナーなど）でズームインすると、醜くぼやけてしまう場合にのみ表示されます。

これには意味がありませんが、それが私にとっての問題でした。

于 2014-02-10T16:03:55.890 に答える