1. ホーム
  2. html

[解決済み] 100% width Twitter Bootstrap 3 テンプレート

2022-06-15 15:10:30

質問

私はブートストラップ初心者で、ブートストラップでコーディングしたい100%幅のテンプレートがあります。最初のカラムは左隅から始まり、私は右端に伸びるGoogleマップを持っています。私は、これを container-fluid クラスでできると思ったのですが、それはもう利用できないようです。bootstrap 3でそのレイアウトを実現する方法が全くわかりません。私はthemeforestからGeometry PSDテンプレートを使用しています、あなたがレイアウトを見たい場合は、ここのリンク。 http://themeforest.net/item/geometry-design-for-geolocation-social-networkr/4752268

どのように解決するのですか?

Bootstrap 3 の場合、カスタムラッパーを使用し、その幅を100%に設定する必要があります。

.container-full {
  margin: 0 auto;
  width: 100%;
}

ここで は Bootply での動作例です。

カスタムクラスを追加したくない場合、すべてを col-lg-12 ( ワイドレイアウトデモ )

Bootstrap 3.1へのアップデート

この container-fluid クラスが Bootstrap 3.1 で復活したので、これを使用して全幅レイアウトを作成できます (追加の CSS は必要ありません)...

Bootstrap 3.1 デモ