Der Grund dafür ist, dass HTML ein neues Zeilenzeichen als Leerraum behandelt und Leerraum gedruckt wird.
Das liegt daran, dass Leerzeichen für Inline-Elemente wichtig sind. Sie können Ihre Bilder immer schweben lassen, wenn Sie sie in einer Linie haben möchten.
Bearbeiten : Wie gewünscht, hier ein einfaches Beispiel: Ссылка
Wenn Sie in diesem div keinen Text mit Bildern haben, font-size: 0; behebt auch dieses Problem
Dies passiert, weil Ihre neue Zeile als Leerzeichen dargestellt wird.
Um dies zu vermeiden, stellen Sie sicher, dass zwischen Ihren Tags kein Leerzeichen ist. Hier ist, was ich normalerweise tue:
%Vor%Sicher, es ist hässlich. Aber es ist der beste Weg, damit umzugehen.
Hinweis zu den anderen Antworten: Floats haben alle möglichen Effekte, die Sie wahrscheinlich nicht wollen (am wichtigsten ist, dass sie neben Ihren anderen Inhalten schweben). Wenn Sie nur Inline-Bilder möchten, ist dies Ihre Lösung.
Es gibt so viele gute Antworten auf diese Frage, aber ich denke, es gibt eine Chance, dass dies für jeden nützlich sein könnte, der in Zukunft dazu kommen wird.
%code% Elemente fließen inline wie Text, haben aber auch eine Breite und Höhe wie Blockelemente. In CSS können Sie ein Element auf %code% setzen, damit es das Verhalten von Bildern repliziert. Daher wäre es schön, an %code% s als %code% s zu denken (Browser verwenden technisch %code% , geben aber spezielle an Behandlung von Bildern wie %code% elements).
Wenn Sie also einen Leerraum wie
hinzufügendazwischen erscheint eine Lücke.
Je nach Situation können Sie eine der folgenden Methoden verwenden, um die Lücke zu beseitigen:
Entfernen Sie den Whitespace zwischen den Elementen, was Sie tun können:
1- Setzen Sie das Thema in eine Zeile
%Vor%2- Entfernen des Leerzeichens
%Vor%3- Verwenden Sie HTML-Kommentare
%Vor%4- Überspringen Sie das schließende Tag (falls es wie %code% ist). (Nur HTML5)
%Vor%5- %code% für das Elternelement
Aus demselben Grund, dass in diesem Absatz ein Leerzeichen zwischen den Buchstaben a und b steht:
%Vor%Jede Art von Leerzeichen in HTML wird als Leerzeichen behandelt (und zu einem einzigen Leerzeichen zusammengefasst).
Dies passiert, weil Ihre neue Zeile als Leerzeichen dargestellt wird.
Um dies zu vermeiden, stellen Sie sicher, dass zwischen Ihren Tags kein Leerzeichen ist. Hier ist, was ich normalerweise tue:
%Vor%Sicher, es ist hässlich. Aber es ist der beste Weg, damit umzugehen.
Hinweis zu den anderen Antworten: Floats haben alle möglichen Effekte, die Sie wahrscheinlich nicht wollen (am wichtigsten ist, dass sie neben Ihren anderen Inhalten schweben). Wenn Sie nur Inline-Bilder möchten, ist dies Ihre Lösung.
Es gibt so viele gute Antworten auf diese Frage, aber ich denke, es gibt eine Chance, dass dies für jeden nützlich sein könnte, der in Zukunft dazu kommen wird.
<img> Elemente fließen inline wie Text, haben aber auch eine Breite und Höhe wie Blockelemente. In CSS können Sie ein Element auf display: inline-block setzen, damit es das Verhalten von Bildern repliziert. Daher wäre es schön, an <img> s als inline-block s zu denken (Browser verwenden technisch display: inline , geben aber spezielle an Behandlung von Bildern wie inline-block elements).
Wenn Sie also einen Leerraum wie
hinzufügendazwischen erscheint eine Lücke.
Je nach Situation können Sie eine der folgenden Methoden verwenden, um die Lücke zu beseitigen:
margin-left
Entfernen Sie den Whitespace zwischen den Elementen, was Sie tun können:
1- Setzen Sie das Thema in eine Zeile
%Vor%2- Entfernen des Leerzeichens
%Vor%3- Verwenden Sie HTML-Kommentare
%Vor% 4- Überspringen Sie das schließende Tag (falls es wie li ist). (Nur HTML5)
5- font-size: 0 für das Elternelement
Tags und Links html