Nehmen wir an, dass ich eine Spanne habe und ein Bild als Hintergrund der Spanne wie folgt einstelle:
%Vor%Wie Sie oben sehen können, ist meine Spannweite leer. Wenn ich etwas Inhalt in meinen Bereich wie:
%Vor%Ich kann das Hintergrundbild der Spannweite ohne Probleme sehen. Aber wenn ich den Bereich leer lasse, sehe ich das Hintergrundbild nicht. Ich dachte mir, dass ich dieses Problem lösen könnte, indem ich meinem Bereich etwas Auffüllen hinzufügte wie:
%Vor%Aber gibt es noch eine andere Möglichkeit, dies zu tun, ohne meinem Bereich etwas Auffüllen hinzuzufügen und meinen Bereich leer zu halten?
Danke
Sie erhalten den gleichen Effekt, wenn Sie Inline-Block verwenden, aber Breite und Höhe einstellen, anstatt Padding zu verwenden.
%Vor%Auch etwas anderes, das Sie stolpern könnte, ist, dass Sie in einem HTML-Attribut doppelte Anführungszeichen verwenden, was einen Parser verwirren und zu unerwarteten Ergebnissen führen könnte. Ich habe sie in den Code, den ich oben gepostet habe, in einfache Anführungszeichen geändert, obwohl keine Anführungszeichen genauso gut funktionieren würden.
Standardmäßig sind Spannen Inline-Seitenelemente (anstatt "Block" -Elemente). Dies bedeutet, dass sie auf der Seite nicht mehr Platz benötigen als ihnen zugewiesen werden, z. B. wenn Sie Text in sie einfügen (wie Sie gefunden haben). Um das zu erreichen, was Sie wollen, benötigen Sie ein kleines CSS, um eine Höhe und Breite für den Bereich zu definieren, aber Sie müssen es auch zu einem Blockelement machen, damit es konsistent gerendert wird.
Alternativ können Sie auch zu einem div wechseln, das bereits ein Blockelement ist. Beachten Sie jedoch, dass das Definieren eines Blockelements bedeutet, dass es Speicherplatz auf Ihrer Seite belegt. Wenn Sie etwas dynamischeres wollen, sollten Sie eine spontane Manipulation des Elements mit Javascript oder ähnlichem in Betracht ziehen.
(Wie auch immer, ignorieren Sie den Hinweis an anderer Stelle auf dieser Seite über einfache und doppelte Anführungszeichen in HTML-Attributen: das ist völliger Unsinn).
mach es einfach nicht leer: Lege ein "leeres" hinein. Dafür gibt es drei Möglichkeiten:
simple space
und fügen Sie ihm den Stil white-space: pre;
hinzu
Nicht brechender Speicherplatz
oder  
Das Nonplus Ultra ist, um css den Trick für Sie zu machen:
Fügen Sie diesen Stil zu Ihrem Bereich hinzu:
%Vor%Was passiert:
Sie fügen einen Inhalt vor (oder besser "vor drinnen") Ihrer Spanne hinzu, der eine ZERO WIDTH JOINER
, und deine Spanne ist nicht leer enymore
Sie sollten width
und height
einstellen.
In der folgenden SO-Frage ist ein Tipp, wie man die Größe des Hintergrundbildes erhält: Wie bekomme ich die Hintergrundbildgröße in jQuery