サイトの速度を最適化しようとしています。以前は丸みを帯びた角に画像を使用していましたが、今は border-radius および -moz-border-radius css ルールで変更しました。速度的にはどの方法が最適ですか? 以前は css ルールの方が速いと思っていましたが、css スプライトについて話しているサイトをたくさん見てきたので、今は少し混乱しています。ああ、私は IE の互換性を気にしないので、あなたが望む方法を提案することができます。
1331 次
4 に答える
4
速度は次のようになります: CSS > スプライト > 個別の画像。スプライトは、コーナーに個別の画像を使用する代わりに、単一の画像を使用して CSS でスライス/配置する場合です。画像を 1 つだけダウンロードするため、より太くなります。CSS は何もダウンロードする必要がないため、最速です。
于 2010-08-25T15:23:57.733 に答える
1
radiusCSS プロパティをサポートするブラウザの場合は、それらを使用してください。画像をロードする必要がなく、ブラウザのネイティブ エンジンでレンダリングできるため、明らかに高速です。
対応していない (古い) ブラウザーの場合は、画像ベースの回避策を適用してください。
ただし、この内容についてはあまり心配しないでください。この領域の最適化によって達成できる速度の向上は、非常にわずかです。
于 2010-08-25T15:23:23.447 に答える
0
どちらもまったく同じですが、CSS3 の仕様はまだ確定していないため、Mozillaはベンダー プレフィックスを使用して実装border-radiusしています。これと、 Webkit (Chrome、Safari) および Mozilla (Firefox) ブラウザーで機能する角丸-moz-のバージョンが必要です。-webkit-
速度に関しては..転送速度とレンダリング速度のどちらについて話しているのかは不明です。どちらの場合も、違いはごくわずかであり、ブラウザーのサポートを最大限にするには、3 つすべてを使用することをお勧めします (もちろん、IE は除きます)。
于 2010-08-25T15:22:30.597 に答える
0
CSS スプライトをお勧めします。これは良いチュートリアルです: http://bavotasan.com/tutorials/simple-rounded-corners-with-a-css-sprite/
于 2010-08-25T15:23:19.033 に答える