隣接する Div を使用するときに CSS で二重枠を防ぐ方法は?

CSS での二重境界線の防止

境界線を持つ 2 つの隣接する div の場合、それらが接する部分に二重境界線があるように見えることがあります。これを解決するには、次の点を考慮してください:

境界線の代わりにアウトラインを使用する

• 各 div の境界線をアウトラインに置き換えます:

<code class="css">.collection .child {
    outline: 1px solid;
}</code>

• アウトラインによって作成された余分な幅を補うために正のマージンを追加します:

<code class="css">.collection .child {
    outline: 1px solid;
    margin-top: 1px;
    margin-left: 1px;
}</code>

境界線で負のマージンを使用する

または、境界線を保持し、負のマージンを使用して重なりを減らすこともできます。

<code class="css">.collection .child {
    margin-top: -1px;
    margin-left: -1px;
}</code>

このオプションは、特に div の高さまたは幅が可変である場合、すべてのシナリオに適しているわけではないことに注意してください。 .

以上が隣接する Div を使用するときに CSS で二重枠を防ぐ方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。