宇宙空間とは何ですか

CSS では、space-around は justify-content プロパティの値です。

justify-content プロパティは、ブラウザがコンテナ内の Flex アイテム間に空白を割り当てる方法を定義します。

space-around の値は、子がコンテナ内に等間隔で均等に配置されることを示します。同時に、最初の子の前後と最後の子の後にも半分のスペースが空きます。

例:

 .container {
   display: flex;
   justify-content: space-around;
 }

space-around を使用すると、子は 2 つごとに等しい間隔で均等に分散され、最初と最後の子はコンテナ境界から同じ間隔になります。

space-around 値と他の justify-content 値の違い:

  • space-between: 両側にスペースはなく、サブアイテムは等間隔に配置されます。

  • 均等な間隔: 境界間隔が含まれ、すべての間隔が等しい

  • space-around: 境界間隔が含まれますが、境界間隔は子の間隔の半分のみです。

つまり、簡単に言うと、space-around は Flex レイアウトで子を均等に分散し、最初と最後の子に対応するスペースを残すことができます。これにより、多くのシナリオで非常に優れた視覚効果を実現できます。頻繁に使用してください~

おすすめ

転載: blog.csdn.net/m0_64880608/article/details/133107602