ああ、私について来なさい、そうすればあなたもいつか有名になるでしょう。
さて、ここまで来たところで、この質問を見てみましょう。
彼は CSS スプライト画像とは何なのかを尋ねました。
ですから、通常、私たちは雪の地図をエルフの地図と呼んでいます。張三のように、彼のビッグネームは張三で、ニックネームはゴーダンです。私は彼のことを張三と呼び、彼は私のことをゴーダンと呼ぶと約束しています。気をつけてください、それだけです。
次に、このことの長所と短所は何であるかを尋ねます。
さて、ここで最初のことについて話しましょう、それは何ですか？端的に言えば、複数の小さなアイコンを組み合わせて 1 つの大きな画像にしたもの、これが雪マップです。
さて、以下に例を示しましょう。
このような使用可能なものについては、2 つの方法があります。最初の方法はすべてです。
小さいアイコンは私が別の絵を作ります、例えばこれを1ポイントppt、2ポイント、3ポイント、4ポイント、5ポイント、5ポイントppt、6ポイントpptと呼び、私が率先して枚数分作ります。 . これが最初の方法です。
2 番目の方法は、雪の地図を使用する方法ですよね? すべてのアイコンまたは一部のアイコンを 1 つの大きな画像にします。これは、複数の小さなアイコンを 1 つの大きな画像に結合することを意味します。これは 2 つの方法です。
したがって、マップを作成するときは、2 番目の方法、つまり複数のマップを 1 つにマージすることについて話しています。したがって、これを行うと、彼が考える利点または欠点のいくつかは、以下で説明する利点と欠点になります。
メリットとデメリットについて話す前に、まず使ってみましょう。友達の中には、これは何だ、何が起こっているの?と思っている人もいるかもしれません。
ああ、少し話しましょう。とても簡単です。たとえば、ここに div がありますが、d iv ではありません。なぜですか?
シンボルを与えてくれなかったら、欠けた空はどこへ行くの?
さて、DNAがあります。さて、dmv にスタイルを追加しましょう。今測りました。ここのアイコンはほぼ 17 で、幅と高さは両方とも夏です。ああ、ここに背景画像を追加します。この背景画像は Man Button と呼ばれます。さて、見てみましょう。さあ、ここで繰り返しましょう。さあ、リフレッシュしてください。
ほら、こんな小さなアイコンができましたよね？さて、実はこれには問題があるのですが、何が問題なのでしょうか？たとえば、これを読み込みたい場合は、背景画像を渡します。背景を黒にすると見えなくなります。または、できるだけ見えるようにピンクにします。 . . から。ああ、今度はこんなものを追加します。
この画像を読み込むには、どのサイズで書き込めばよいでしょうか? こんな感じです。あなたの為に絵を描かせて下さい。さて、私のマンゴー ポイントの ppt はとても大きいですよね? ここにあります。そして、ここに 1 枚の写真、2 枚の写真、3 枚の写真、4 枚の写真があります。絵が下手かもしれません。写真がたくさんあります。それぞれが実用的な要素。ここが私のページです。私のボックスをここに置きたいです。このボックスにこれら 2 組のフィルムを入れてください。
では、どのように配置されているのかというと、何も書かないとこのように重なってしまいますが、意味が分かりますか？ただ重なるだけです。書かないとxとyはゼロとゼロになります。そうですね、実際には、この雪の地図を使用しています。この ppt をマンクリックして移動すると、このボックスに表示されます。
「こう動かなければいけない」「左に行かなければいけない」というように、左の値がプラスかマイナスかに注目してください。左に行くと減少します。このボックスです。マネージャーの境界にあると予想されます。移動するので、ここにあるので減少していると言われます。左に行けば減少します。上がる、下がる、ああ、やっとここに表示されました、私のボックスと重なっています、ああ、やっとこの絵が表示されました。つまり、これに地図を書かせてボックスをたどらせ、それを表示したいとします。
つまり、これを見せたい場合はどうすればよいでしょうか？それと同じで、ここを左に行って上に行くと、この位置に行き着くんですよね、それだけです。さて、それでは、この写真を見せようとしているとしましょう。この写真は、左への距離です。LGはどこまで行くの？
それを測定します。23はほぼ同じなので、ここに書きます。ああ、X 軸が負の可能性があります。注意して、23 日を引き算してください。
良い。下から上までどのくらいありますか?このピースが 88 になるまで測ってみましょう。見えますか?
高さは八十八ですから、八十八はマイナス、上がるから八十八です。さて、リフレッシュを見てみましょう。比較のためにこの写真を見てください。
ねえ、今どこで測ったの? これが写真です。あ、白だからちょっと分かりにくいかも知れませんが、黒いところを見てくださいね、模様はここ、ここ、ここ、そう、ちゃんと読み込まれています、ということです。
さて、この雪マップの使い方が 1 つわかりました。ページをめくって、その利点と欠点の 1 つについて話しましょう。
そこで、ここでは皆さんにメリットとデメリットを直接または正確に説明し、直接に入りましょう。
利点は何ですか? ああ、減りました。ATP 要求の数も減り、改善されました。
皆さん、考えてみてください。私は 20 個のアイコンを作成しますが、20 枚の写真をロードし、それを 20 回ロードする必要があります。
皆さんを 1 つにまとめてからマップを作成します。ロードする必要があるのは 1 回だけです。
先ほど説明した 2 つのオプションについて、最初のオプションではページの読み込みが必要になる場合があり、たとえば、この小さなアイコンが 50 個または 50 個ある場合、50 回近くかかります。
マップの作成に関しては、大きな画像にマップを追加するだけで、リクエストの数が減り、パフォーマンスが向上します。
これが利点ですが、もちろん欠点は何ですか？
ああ、この画像の一部の要素を変更する必要がある場合、または UI を調整および変更する必要がある場合は、欠点があります。
たとえば、コンテンツの幅を広くしたり高くしたり、特定の要素を削除したり別のものに置き換えたりする必要があります。
現場ではさまざまな変更が行われている可能性があり、メンテナンスが不十分になる可能性があります。
ああ、なぜメンテナンスが必要なのでしょうか? たとえば、写真、位置、コンテンツの幅と高さを変更すると、すべてメンテナンスの比較が発生します。ああ、変更を加えたので、たとえば左側に白いバーを追加しましたが、これはすべての行の値が間違っていることを意味しますか?
ああ、測り直さないといけないとか、全部変えないといけないとか、もしかしたらこの写真をダウンロードしてきたのかもしれないので、また位置を変えないといけないとか、すごく面倒なんですけど、どうやってメンテナンスするかというと、ああ、メンテナンスは比較的簡単なんです。 。
また、写真ごとに測る必要があり、写真ごとに位置を調べなければならないので、これもかなり面倒です。
でも欠点までは書きません、そんなことは当たり前のことですよね? 使いたいからには、ほとんどすべてのものに長所と短所があり、短所があれば長所と長所があるはずです。すべての利点を備え、欠点がないものはほとんどありません。
人はどうでしょうか? 人には欠点や長所もたくさんあるので、それはあなたの状況によって異なります。ただし、CSS の水平マップまたは精度マップを知る必要があります。
どのような問題を解決できるのか、メリットとデメリットは何なのか、それを私たちは知っておく必要があります。
さて、この問題に関しては、まずはここで終わりにしましょう。