ブートストラップ行をコンテナを超えて拡張するにはどうすればよいですか?

ブートストラップ行をコンテナの外に拡張

ブートストラップでは、要素は .container クラス内で定義された行内に含まれます。ただし、コンテナを超えて行を拡張する必要がある場合があります。

これを実現する 1 つの方法は、CSS 疑似要素を利用することです。左の列 (左のクラス) の高さに一致する ::before 要素を作成します。この要素は左側に拡張されます。

.left:before {
    left: -999em;
    background: red;
    content: '';
    display: block;
    position: absolute;
    width: 999em;
    top: 0;
    bottom: 0;
}

別のアプローチは、コンテンツ .container の後ろに絶対配置された .container-fluid を使用することです。この「ゴースト」コンテナは行の幅を拡張します。

.abs {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
}

これらのソリューションを使用すると、コンテナを超えて行を拡張できるため、設計に柔軟性がもたらされます。

以上がブートストラップ行をコンテナを超えて拡張するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。