Selbstverständnis des Hintergrundpositionsattributs bei der Positionierung von Hintergrundbildern

In letzter Zeit muss ich im Projekt viele fragmentierte Bilder wie Beschriftungen und Schaltflächen verwenden. Darüber hinaus hatte ich nie die Gelegenheit, die „Elf-Technologie“ in CSS zu verwenden. Hier schreibe ich mein Verständnis der Hintergrundposition in ein Dokument, damit mehr Leute es verwenden und lernen können.

Die Kombination aller vorhandenen Buttonbilder

Schritt 1 : Wir möchten anzeigen　Um diesen Button zu erstellen, müssen wir zunächst ein Div (später Fenster genannt)-Tag definieren, dessen Breite und Höhe gerade ausreichen soll, um diesen Button aufzunehmen.

Schritt 2 : Dies ist der Schwerpunkt meines heutigen Vortrags. Viele Leute sagen, dass die Hintergrundposition das Hintergrundbild der Operation ist, aber ich sage, es ist das Fenster der Operation. Durch das Fenster können wir nur einen Teil des Hintergrundbildes sehen .

Das Verständnis der horizontalen und vertikalen Koordinaten besteht darin, dass, solange sich das Fenster innerhalb des Bildbereichs bewegt, wir von einer Bewegung in negativer Richtung (negative Koordinaten) sprechen.

zeigen Für diese Bildschaltfläche müssen wir die Koordinaten nicht angeben, es ist die Standardeinstellung. Natürlich können Sie auch #div5{background-position: 0px 0px;}

zeigen Für diese Bildschaltfläche müssen Sie die Koordinaten der Hintergrundposition festlegen: #div6{ background-position:-42px 0px;}

zeigen Diese Bildschaltfläche, #div8{ background-position:-42px -41px;}

Gleiches gilt auch für das Folgende.

Viele von Ihnen verstehen vielleicht, was ich hier sage. Ich erkläre Ihnen nur, wie Sie es verstehen können, wenn Sie gerade erst anfangen. Wenn etwas nicht stimmt, kritisieren Sie mich bitte. (Ich weiß nicht, wie man Schriftsatz macht, ich hoffe, Sie verstehen das)