Detaillierte Erklärung zweier Methoden zur Behebung eines Fehlers in der Justify-Content-Space-Between-Ausrichtung des Flex-Layouts

Wenn Sie „display:flex, justify-content: space-betweend“ festlegen, werden die untergeordneten Elemente an den Seiten ausgerichtet und der verbleibende Platz gleichmäßig aufgeteilt.

Beispiel: Wenn Sie drei untergeordnete Elemente in einer Zeile platzieren möchten

Wirkung:

Dies scheint in Ordnung zu sein und sieht gut aus, aber wenn in der nächsten Zeile nicht drei Zeichen stehen, gibt es Probleme, wenn nur zwei stehen.

Das sieht besonders ekelhaft aus, mit einem großen leeren Raum in der Mitte. Es sieht besonders wie ein Fehler aus, anstatt den gewünschten Effekt der Ausrichtung nacheinander mit der vorherigen Zeile zu erzielen.

Um dieses Problem zu lösen, gibt es zwei Methoden:

• Pseudoklasse: nach
• Geben Sie ein Platzhalterelement an

Pseudoklassenlösung

Platzhalterelement-Lösung

Wirkung

Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird.