Es gibt viele Möglichkeiten, das Layout zu flexen, sodass zwei Boxen auf der linken und rechten Seite verteilt sind

Methode eins:

Eine übergeordnete Box enthält zwei untergeordnete Boxen, Sie können das Attribut justify-content:space-between verwenden

<div class='parent'>
 
<div class="left"></div>
 
<div class="right"></div>
 
</div>

 .parent { anzeige:flex; Biegerichtung: Reihe; justify-content:space-between; }
 

 

 

 

Methode zwei:

Richten Sie zuerst die untergeordnete Box rechts aus

display:flex;justify-content:flex-end;

Setzen Sie dann flex: 1 nur für die rote Box;

Prinzip: Verwenden Sie flex: 1, um die Breite dynamisch zu füllen

Methode drei:

Sie können margin-right einstellen: auto für das rote Kästchen;

Prinzip: Nachdem Sie die Breite der übergeordneten Box festgelegt haben, wird durch die Einstellung margin-right: auto automatisch die verbleibende volle Breite belegt

 

 

Ich denke du magst

Origin blog.csdn.net/m0_59735348/article/details/128112041
Empfohlen
Rangfolge