ホームページ  >  記事  >  ウェブフロントエンド  >  Bootstrap 4 ベータ版の列オフセットはどうなりましたか?

Bootstrap 4 ベータ版の列オフセットはどうなりましたか?

Linda Hamilton
Linda Hamiltonオリジナル
2024-11-08 00:50:02791ブラウズ

What Happened to Column Offsetting in Bootstrap 4 Beta?

Bootstrap 4 ベータ: 列オフセットの削除と復元

Bootstrap 4 は、ベータ 1 リリースで、その方法に大幅な変更を導入しました。柱がオフセットされました。ただし、その後の Beta 2 リリースでは、これらの変更は元に戻されました。

offset-md-* から ml-auto へ

Bootstrap 4 Beta 1 では、 offset-md-* クラスは削除されました。代わりに、開発者は .ml-auto クラスを使用して列をオフセットすることが推奨されました。ただし、この方法では、前のアプローチと同じレベルの精度は得られませんでした。

ベータ 2 でのオフセット クラスの復元

幸いなことに、ベータ 2 では、オフセット クラスが復元されました。新しい構文では、offset-{breakpoint}- という形式が使用され、以前のcol-{breakpoint}-offset- 構文が置き換えられます。

カスタム オフセット

現在非推奨になっている

ダミー プレースホルダーの使用

<br><div><pre class="brush:php;toolbar:false">  <div>
などのカスタム列オフセットを実現するには


ml-auto と mr-auto を使用する

2 つの隣接する列を中央に配置するには、開発者は次のことを行うことができます。 ml-auto と mr-auto を両方の列に適用します。

<br><div><pre class="brush:php;toolbar:false">    <div>


mx-auto の使用

単一列を中央に配置するには、開発者は mx-auto を使用して両側に均等なマージンを作成できます。

結論

Bootstrap 4 での列オフセットの削除と復元により、開発者に一時的な混乱が生じました。ただし、ベータ 2 で特定のオフセット クラスが再導入され、回避策が利用できるようになったことで、開発者は引き続きブートストラップ 4 でカスタム列レイアウトを実現できます。

以上がBootstrap 4 ベータ版の列オフセットはどうなりましたか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事:CSS は内部 HTML に基づいて要素を選択できますか?次の記事:CSS は内部 HTML に基づいて要素を選択できますか?

関連記事

続きを見る