フクロウセレクター (*+*) はマージンの問題を解決します

複数のセレクターのマージンの積み重ねの問題、またはリスト、ナビゲーションなどの複数のコンポーネント間の間隔の問題を解決するには、次のように *+* owl セレクターを使用して問題を解決します。

*+*、先頭はユニバーサル セレクター *、+ は隣接するコンビネータ、最後の * は別のユニバーサル セレクターです。同じ親を持つページ上の最初以外の要素を選択します。サイドバーの各要素は等間隔に配置できます。

body * + *{
margin-top:1.5em;
}

上記のコードは、積み重ねられた要素間の間隔をグローバルに設定します。

以下は具体的なデモ例です

https://codepen.io/AllThingsSmitty/pen/gMRvWq https://codepen.io/AllThingsSmitty/pen/gMRvWq CSS プロフェッショナル スキル - 「CSS プロフェッショナル スキル」 - BookStack.com · CSS の向上に役立つ BookStack CSS プロフェッショナル スキルスキルコレクション。https://www.bookstack.cn/read/css-protips-zh/css.mdその他の CSS テクニックの URL を追加する 以下の Web サイトのオンライン テスト コードを使用する方が簡単です。

https://codepen.io/pen/ icon-default.png?t=M0H8https://codepen.io/pen/

おすすめ

転載: blog.csdn.net/lap2004/article/details/122928528